body {
    font-family: "Poppins", serif;
    font-size: 16px;
    line-height: 24px;
    overflow-x: hidden;
}

.container-fluid{
    max-width: 1920px !important;
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}


.container{
    max-width: 1300px !important;
    width: 100% !important;
    margin: 0 auto;
    padding: 0 15px;
}

.container-small{
    max-width: 1000px !important;
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}

p{
    font-family: "Inter", sans-serif;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #1F1F1F;
}

b, strong {
    font-weight: 700;
}

/**********HEADER**********/





.menu-section{
    background-color: transparent !important;
    padding: 20px 0;
    height: 91px;
    border-bottom: 1px solid #e5e5e5;
}

.menu-section nav.navbar.navbar-expand-lg.bg-body-tertiary{
    background-color: transparent !important;
    padding: 0px;
    border-color: unset;
    margin-bottom: 0px;
    min-height: auto;
    border: none;
}

header.fixed-top .menu-section{
    /*background: linear-gradient(to right, #a0cfff, #084787);*/
    /*box-shadow: 0 5px 5px rgb(0 0 0 / 20%);*/
    background-color: #fff !important;
    /*padding: 0px !important;*/
    box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
}

header.fixed-top .menu-section .navbar-brand img{
    width: 150px;
}


.menu-section.fixed-top .navbar-expand-lg .navbar-collapse{
    border-top: none;
}

a.navbar-brand {
    width: auto;
    padding: 0px;
}

.navbar-brand img{
    width: 150px;
}


.navbar-fixed {
  top: 0;
  z-index: 100;
  position: fixed;
  width: 100%;
}

header.fixed-top .menu-section .navbar-expand-lg .navbar-nav .nav-link{
    padding: 6px 20px;
}

.navbar-expand-lg .navbar-nav .nav-link{
    padding: 6px 20px 3px 20px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #1F1F1F;
    border-bottom: 3px solid transparent;
} 

.navbar-expand-lg .navbar-nav .nav-link i{
    color: #176DF2;
    padding-right: 5px;
}

.navbar-expand-lg .navbar-nav .nav-link.active,
.navbar-expand-lg .navbar-nav .nav-link:hover{
    color: #176DF2;
    border-radius: 10px;
}

.navbar-expand-lg .navbar-nav .nav-item{
}

.navbar-expand-lg .navbar-nav .nav-link.active:after{
    background-color: #176DF2;
    /*width: 60px;*/
    height: 3px;
    text-align: center;
    margin: 0 auto;
    display: block;
    z-index: 1;
    content: '';
    margin-top: 5px;
    margin-bottom: -5px;
}
/*.navbar-expand-lg .navbar-nav .nav-link:hover:after{
    background-color: #176DF2;
    width: 60px;
    height: 3px;
    text-align: center;
    margin: 0 auto;
    display: block;
    z-index: 1;
    content: '';
    margin-top: 5px;
    margin-bottom: -5px;
}*/

a.btn.btn-login{
    border: 1px solid #ED2A4A;
    background-color: #ED2A4A;
    padding: 10px 14px 11px;
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #fff;
    border-radius: 0px;
}

a.btn.btn-login:hover{
    border: 1px solid #ED2A4A;
    background-color: #ED2A4A;
    color: #fff;
}

ul.dropdown-menu.dropdown-menu-dark.show {
    padding: 0px;
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 0px;
    border-bottom: none;
}

ul.dropdown-menu.dropdown-menu-dark.show .dropdown-item{
    padding: 10px 10px;
    border-bottom: 1px solid #ddd;
    font-size: 14px;
    line-height: 18px;
    color: #000;
    font-weight: 600;
    transition: 0.5s;
}

ul.dropdown-menu.dropdown-menu-dark.show .dropdown-item:hover{
    color: #145ccb;
}

ul.dropdown-menu.dropdown-menu-dark.show .dropdown-item:hover i.fa-arrow-right{
    padding-right: 5px;
}


.nav-righ-box ul{
    padding: 0px;
    margin: 0px;
}

.nav-righ-box ul li{
    list-style-type: none;
    display: inline-block;
    padding-left: 10px;
    margin-left: 10px;
    border-left: 1px solid #ebe6e7;
}

.nav-righ-box ul li:first-child{
    border-left: none;
}

.nav-righ-box ul li a{
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #1F1F1F;
    text-decoration: none;

}

.nav-righ-box .dropdown-toggle::after{
    display: none;
}

.nav-righ-box ul li button#dropdownMenuButton1 {
    border: 1px solid #ebe6e7;
    background-color: transparent;
    border-radius: 30px;
    color: #1F1F1F;
    padding: 3px 12px;
}

.nav-righ-box .dropdown-menu[data-bs-popper] {
    left: unset;
    right: 0;
    width: 253px;
    height: 285px;
    text-align: center;
    box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
    padding: 30px;
    border: 1px solid #eee;
}

.nav-righ-box ul li i.fa.fa-user {
    background-color: #176DF2;
    padding: 5px;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    font-size: 12px;
    line-height: 18px;
    color: #fff;
}

.nav-righ-box ul li i.fa-solid.fa-bars {
    font-size: 14px;
    position: relative;
    top: 2px;
    margin-right: 5px;
}

.nav-righ-box ul li ul li{
    border-left: none;
    padding-left: 0px;
    margin-left: 0px;
    display: block;
}

.nav-righ-box ul li ul li h5{
    color: #101828;
    font-size: 22px;
    line-height: 28px;
    font-weight: 700;
    margin-bottom: 10px;
}

.nav-righ-box ul li ul li p{
    font-size: 14px;
    line-height: 18px;
    color: #4a5565;
    margin-bottom: 60px;
}

.nav-righ-box ul li ul li a.login{
    background-color: #176DF2;
    padding: 10px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #fff;
    display: block;
    text-decoration: none;
    margin-bottom: 20px;
    border-radius: 10px;
}

.nav-righ-box ul li ul li a.login i{
    padding-right: 5px;
}

.nav-righ-box ul li ul li a.login:hover{
    background-color: #1447e6;
}

.nav-righ-box ul li ul li a.signup{
    background-color: #dfecff;
    padding: 10px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #1F1F1F;
    display: block;
    text-decoration: none;
    border-radius: 10px;
}

.nav-righ-box ul li ul li a.signup:hover{
    background-color: #ebe6e7;
}

.nav-righ-box ul li ul li a.signup i{
    padding-right: 5px;
}







/**********MOBILE MENU***********/

.clickmenus{
    font-size: 20px;
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: 0px;
    color: #fff;
    z-index: 99;
    display: none;
    float: left;
    background-color: #176DF2;
    padding: 5px 10px;
    border-radius: 5px;
}

.clickmenus h6{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #dc3545;
    text-transform: uppercase;
    float: right;
    margin-left: 10px;
}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  background: #176DF2;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 40px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #222;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #fff;
}

.sidenav .closebtn {
    position: absolute;
    top: 8px;
    right: 11px;
    font-size: 50px;
    margin-left: 50px;
    z-index: 9999;
    padding: 0px;
    color: #fff;
}

@media screen and (max-height: 450px) {
  .sidenav a {font-size: 18px;}
}


.sidenav .card{
    background-color: transparent;
    border: none;
}


.card-header{
  background-color: transparent;
  border-bottom: 1px solid #eee;
}

.sidenav .card-body{
    padding: 0 10px;
}

.mobile-menus ul{
    padding: 0px;
    margin: 0px;
}

.mobile-menus ul li{
    list-style-type: none;
}

.mobile-menus ul li a {
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    color: #fff;
    padding: 10px 20px;
    border-bottom: 1px solid #4e94ff;
}

.sidenav .card-body ul li a {
    font-size: 12px;
}


.sidenav .card-body ul li a:hover {
    color: #fff;
    font-size: 12px;
    background-color: transparent;
}

.mobile-menus ul li a i.fa{
    float: right;
    margin-top: 5px;
}


@media(max-width: 992px)
{
  .clickmenus{
    display: block;
    top: 28px;
    right: 12px;
    left: unset;
  }

  .fixed-top .clickmenus {
    top: 29px;
    z-index: 9;
  }

  .navbar-light .navbar-brand{
    display: block;
  }

  .navbar-toggler-icon{
    display: none;
  }

  nav.navbar.navbar-expand-lg.navbar-light{
    height: auto;
  }

  .navbar-toggler{
    display: none;
  }
  .nav-logo-btn{
    margin-right: 10%;
  }
}



/*************CURRENCY SELECTOR***********/


.currency-popup .modal-header{
    display: block;
}

.currency-popup h5.modal-title{
    font-size: 18px;
    line-height: 20px;
    font-weight: 600;
    margin-bottom: 2px;
}

.currency-popup .modal-header p{
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0px;
}

.currency-popup .modal-header button.btn-close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 10px;
    color: #ff0000 !important;
}

.currency-popup .modal-body{
    padding: 0px;
}

.currency-popup .currency-selector {
    background-color: white;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    width: 100%;
    max-width: 400px;
    overflow: hidden;
}

.currency-popup .selector-header {
    padding: 24px 24px 16px;
    border-bottom: 1px solid #e0e0e0;
}

.currency-popup .selector-title {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
}

.currency-popup .selector-subtitle {
    font-size: 14px;
    color: #666;
}

.currency-popup .search-container {
    padding: 16px 24px;
    border-bottom: 1px solid #e0e0e0;
}

.currency-popup .search-input {
    width: 100%;
    padding: 10px 12px 10px 40px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.35-4.35"></path></svg>');
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 16px;
}

.currency-popup .search-input:focus {
    outline: none;
    border-color: #4285f4;
}

.currency-popup .currency-list {
    max-height: 300px;
    overflow-y: auto;
}

.currency-popup .currency-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.2s;
}

.currency-popup .currency-item:hover {
    background-color: #f9f9f9;
}

.currency-popup .currency-item.selected {
    background-color: #f0f7ff;
}

.currency-popup .currency-info {
    display: flex;
    flex-direction: column;
}

.currency-popup .currency-name {
    font-size: 16px;
    font-weight: 500;
    color: #333;
    margin-bottom: 4px;
}

.currency-popup .currency-region {
    font-size: 14px;
    color: #666;
}

.currency-popup .checkmark {
    width: 20px;
    height: 20px;
    background-color: #4285f4;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 14px;
    visibility: hidden;
}

.currency-popup .currency-item.selected .checkmark {
    visibility: visible;
}

.currency-popup .selector-footer {
    padding: 16px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f9f9f9;
    border-radius: 0 0 10px 10px;
}

.currency-popup .footer-text {
    font-size: 14px;
    color: #666;
}

.currency-popup .done-button {
    background-color: #4285f4;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.currency-popup .done-button:hover {
    background-color: #3367d6;
}













/***********BANNER SECTION**********/

.banner-section{
    background: url("../images/banner-img.jpeg") top center no-repeat;
    width: 100%;
    display: table;
    /* height: 700px; */
    /* change */
    height: 450px;
    background-size: cover;
}

.banner-section .overlay{
    /* background-color: rgb(23 109 242 / 32%); */
    /* change */
    background-color: rgb(22 36 86 / 50%);
    padding: 70px 0;
    /* height: 700px; */
    /* change */
    height: 400px;
    display: table-cell;
    vertical-align: middle;
}











.banner-section .booking-container {
    /*background-color: rgba(255, 255, 255, 0.9);*/
    border-radius: 12px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    /*box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);*/
    /*overflow: hidden;*/
}

/*.header {
    padding: 30px;
    text-align: center;
    background-color: #f8f9fa;
}*/

.banner-section .header h1 {
    font-family: "Poppins", serif;
    /* font-size: 55px; */
    color: #fff;
    /* margin-bottom: 20px; */
    transition: all 0.3s ease;
    /* font-weight: 700; */
    line-height: 62px;
    /* change */
    font-size: 50px;
    margin-bottom: 10px;
    font-weight: 600;
}

.banner-section .header p {
    font-size: 20px;
    color: #fff;
    transition: all 0.3s ease;
    line-height: 30px;
    font-weight: 600;
    margin-bottom: 30px;
}

.banner-section .tabs {
    display: flex;
    max-width: 460px;
    gap: 20px;
    margin-bottom: 30px;
    /*background-color: #e8f0fe;*/
}

.banner-section .tab {
    /* flex: 1;
    padding: 20px 0;
    text-align: center;
    cursor: pointer;
    font-weight: 700;
    color: #fff;
    transition: all 0.3s ease;
    position: relative;
    border-radius: 20px;
    border: 2px solid #fff;
    font-size: 18px;
    font-family: "Inter", sans-serif; */
    /* change  */
    flex: 1;
    padding: 14px 0px;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
    color: #fff;
    transition: all 0.3s ease;
    position: relative;
    border-radius: 100px;
    border: 1.5px solid #fff;
    font-size: 16px;
}

.banner-section .tab.active {
    color: #176DF2;
    background-color: white;
}

/*.banner-section .tab.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #176DF2;
}*/

/*.banner-section .tab:hover:not(.active) {
    background-color: #d2e3fc;
}
*/
.banner-section .search-container {
    /* padding: 30px;
    border-radius: 20px; */
    background-color: #f8f9fa;
    /* change */
    padding: 20px 20px;
    border-radius: 8px;
}

.banner-section .search-form {
    /*display: flex;
    flex-wrap: nowrap;
    gap: 15px;
    align-items: flex-end;*/
}

.banner-section .form-group {
    flex: 1;
    width: 100%;
    position: relative;
}

.banner-section .form-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #202124;
}

.banner-section .form-control {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #dadce0;
    border-radius: 6px;
    font-size: 15px;
    transition: all 0.3s ease;
    color: #05347c;
    font-weight: 600;
    font-family: "Inter", sans-serif;
}

.banner-section .form-control i{
    padding-right: 5px;
}

.banner-section input.form-control.calendar-text{
    padding-left: 35px;
}

.banner-section .form-group i.fa-calendar{
    position: absolute;
    top: 18px;
    left: 15px;
    color: #05347c;
}

.banner-section .form-control::placeholder{
    color: #05347c;
}

.banner-section .form-control:focus {
    outline: none;
    border-color: #05347c;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.2);
}

.banner-section .dropdown {
    position: relative;
}

.banner-section .dropdown-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.banner-section .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: white;
    border: 1px solid #dadce0;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 10;
    display: none;
    margin-top: 5px;
}

.banner-section .dropdown-menu.show {
    display: block;
}

.banner-section .dropdown-search {
    padding: 10px;
    border-bottom: 1px solid #dadce0;
}

.banner-section .dropdown-search input {
    width: 100%;
    padding: 8px;
    border: 1px solid #dadce0;
    border-radius: 4px;
}

.banner-section .dropdown-list {
    max-height: 200px;
    overflow-y: auto;
}

.banner-section .dropdown-item {
    padding: 10px 15px;
    cursor: pointer;
    transition: background-color 0.2s;
}

.banner-section .dropdown-item:hover {
    background-color: #f1f3f4;
}

.banner-section .guests-dropdown {
    min-width: 250px;
}

.banner-section .guests-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    border-bottom: 1px solid #f1f3f4;
}

.banner-section .guests-row:last-child {
    border-bottom: none;
}

.banner-section .guests-label {
    font-weight: 500;
}

.banner-section .guests-control {
    display: flex;
    align-items: center;
    gap: 15px;
}

.banner-section .guests-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #dadce0;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
}

.banner-section .guests-btn:hover {
    background-color: #f1f3f4;
}

.banner-section .guests-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.banner-section .guests-count {
    min-width: 20px;
    text-align: center;
    font-weight: 500;
}

.banner-section .btn-search {
    background-color: #176DF2;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 12px 25px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    white-space: nowrap;
    width: 100%;
}

.banner-section .btn-search:hover {
    background-color: #1765cc;
}

.banner-section .btn-search i {
    font-size: 1.2rem;
}

.banner-section .tab-content {
    display: none;
}

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

/* Custom daterangepicker styles */
.banner-section .daterangepicker {
    z-index: 9999 !important;
}

.banner-section .daterangepicker .calendar-table {
    background: white;
}

.banner-section .daterangepicker .calendar-table .next span, 
.banner-section .daterangepicker .calendar-table .prev span {
    border-color: #176DF2;
}

.banner-section .daterangepicker td.in-range {
    background-color: #e8f0fe;
    color: #176DF2;
}

.banner-section .daterangepicker td.active, 
.banner-section .daterangepicker td.active:hover {
    background-color: #176DF2;
}

.banner-section .daterangepicker select.monthselect, 
.banner-section .daterangepicker select.yearselect {
    border: 1px solid #dadce0;
    border-radius: 4px;
}

.banner-section .daterangepicker .input-mini {
    border: 1px solid #dadce0;
    border-radius: 4px;
}

.banner-section .daterangepicker .ranges li {
    border-radius: 4px;
}

.banner-section .daterangepicker .ranges li.active {
    background-color: #176DF2;
}

.banner-section .daterangepicker .calendar th, 
.banner-section .daterangepicker .calendar td {
    border-radius: 50%;
}

/* Fix z-index for guests dropdown */
.banner-section .guests-dropdown .dropdown-menu {
    z-index: 10000 !important;
}


/**************POPULAR TRIP SECTION************/

.popular-trip-section{
    padding-top: 40px;
}

.popular-trip-section h4{
    font-family: "Poppins", serif;
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

.popular-trip-section h4 a{
    text-align: right;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #176DF2;
    float: right;
    text-decoration: none;
    position: relative;
    top: 0px;
    border: 3px solid #176DF2;
    padding: 8px 24px;
    border-radius: 30px;
}

.popular-trip-section h4 a:hover{
    background-color: #176DF2;
    border: 3px solid #176DF2;
    color: #fff;
}

.tripbox-content{
    transition: 250ms all ease-in-out;
}

.tripbox-content:hover{
    transform: scale(1.05);
}

.popular-trip-section img{
    width: 100%;
    height: 188px;
    object-fit: cover;
    /* /* border-radius: 12px 12px 0 0; */
    /* change */
    border-radius: 8px 8px 0 0; */
    border-radius: 8px 8px 0 0;
}

.trip-content{
    padding: 15px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
}

.trip-content h5{
    font-family: "Poppins", serif;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    margin-bottom: 15px;
}

.trip-content h5 a{
    color: #1F1F1F;
    text-decoration: none;
}

.trip-content h5 a:hover{
    color: #176DF2;
}

.trip-content p{
    margin-bottom: 0px;
}

.trip-content p span{
    float: right;
}

.trip-content p span strong{
    font-weight: 700;
    color: #176DF2;
    font-size: 20px;
}


/*****************POPULAR SECTION**************/

.popular-section{
    padding: 50px 0;
    position: relative;
}

.popular-section h4{
    font-family: "Poppins", serif;
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

.popular-section h4 a{
    text-align: right;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #176DF2;
    float: right;
    text-decoration: none;
    position: relative;
    top: 0px;
    border: 3px solid #176DF2;
    padding: 8px 24px;
    border-radius: 30px;
}

.popular-section h4 a:hover{
    background-color: #176DF2;
    border: 3px solid #176DF2;
    color: #fff;
}

.popular-box{
    transition: all 0.3s ease;
}

.popular-box:hover{
    transform: translateY(-4px);
}

.mission-left{
    position: relative;
}

.popular-section a{
    text-decoration: none;
}

.mission-left img{
    width: 100%;
    object-fit: cover;
    height: 188px;
    position: relative;
    /* /* border-radius: 12px 12px 0 0; */
    /* change */
    border-radius: 8px 8px 0 0; */
    /* change */
    border-radius: 8px 8px 0 0;
}

.mission-left h5{
    font-family: "Poppins", serif;
    position: absolute;
    bottom: 0;
    padding: 20px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
    margin-bottom: 0px;
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #fff;
    border-radius: 0 0 8px 8px;
    width: 100%;
    height: 100px;
    padding-top: 55px;
}

.mission-left h5 a{
    color: #fff;
    text-decoration: none;
}

.mission-left i.fa-regular.fa-bookmark {
    position: absolute;
    background-color: #fff;
    right: 10px;
    top: 10px;
    padding: 10px;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    font-size: 16px;
    line-height: 12px;
    text-align: center;
    color: #176DF2;
}

.populat-content{
    padding: 15px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    margin-bottom: 30px;
}

.populat-content p{
    font-size: 12px;
    line-height: 20px;
    display: flex;
    gap: 10px;
}

.populat-content p i{
    color: #4a5565;
    position: relative;
    top: 6px;
}

.populat-content ul{
    padding: 0px;
    margin: 0px;
}

.populat-content ul li{
    list-style-type: none;
    display: inline-block;
}

.populat-content ul li a{
    font-size: 10px;
    line-height: 14px;
    font-weight: 600;
    color: #176DF2;
    background-color: #dfecff;
    padding: 4px 6px;
    border-radius: 30px;
    display: block;
}

/**********DEAL SECTION*********/

.deal-section .deal-column-box-left{
    background: url("../images/desti3.webp") center center no-repeat;
    width: 100%;
    background-size: cover;
    /* border-radius: 20px; */
    /* change */
    border-radius: 8px;
}

.deal-section .deal-column-box-left .overlay{
    background-color: rgb(0 0 0 / 50%);
    /* padding: 40px; */
    border-radius: 20px;
    /* change */
    padding: 40px;
}

.deal-section .deal-column-box-right{
    background: url("../images/desti2.webp") center center no-repeat;
    width: 100%;
    background-size: cover;
    border-radius: 20px;
}

.deal-section .deal-column-box-right .overlay{
    background-color: rgb(0 0 0 / 50%);
    padding: 40px;
    /* border-radius: 20px; */
    /* change */
    border-radius: 8px;
}

.deal-section h4{
    font-family: "Poppins", serif;
    /* font-size: 40px !important; */
    color: #fff !important;
    margin-bottom: 20px !important;
    /* font-weight: 700; */
    line-height: 48px !important;
    /* change */
    font-size: 36px !important;
    font-weight: 600;
}

.deal-section p {
    /* font-size: 20px; */
    color: #fff;
    /* line-height: 30px; */
    /* font-weight: 600; */
    /* margin-bottom: 20px; */
    /* change */
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    margin-bottom: 30px;
}

a.btn.btn-deals {
    font-family: "Poppins", serif;
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #fff;
}

a.btn.btn-deals:hover{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}

/*****************HOTEL SECTION****************/

.hotel-section{
    padding: 30px 0;
    position: relative;
}

.hotel-section a{
    text-decoration: none;
    /*position: relative;*/
}

.carousel-container{
    position: relative;
}

.hotel-section h4{
    font-family: "Poppins", serif;
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

.hotel-section h4 a{
    text-align: right;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #176DF2;
    float: right;
    text-decoration: none;
    position: relative;
    top: 0px;
    border: 3px solid #176DF2;
    padding: 8px 24px;
    border-radius: 30px;
}

.hotel-section h4 a:hover{
    background-color: #176DF2;
    border: 3px solid #176DF2;
    color: #fff;
}

.hotel-column{
    position: relative;
}

.hotel-section .carousel-inner img{
    height: 188px;
    width: 100%;
    object-fit: cover;
    /* border-radius: 12px 12px 0 0; */
    /* change */
    border-radius: 8px 8px 0 0;
}

.hotel-section a.icon-heart i.fa-regular.fa-heart {
    position: absolute;
    background-color: rgb(0 0 0 / 56%);
    right: 20px;
    top: 10px;
    padding: 10px;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    font-size: 16px;
    line-height: 17px;
    text-align: center;
    color: #fff;
    z-index: 999;
}

.hotel-section a.icon-heart i.fa-regular.fa-heart:hover{
    background-color: #fff;
    color: #176DF2;
}

.hotel-section h6.hotel-offer{
    position: absolute;
    background-color: #176DF2;
    left: 20px;
    top: 10px;
    padding: 6px 16px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    z-index: 999;
}

.hotel-section h6.hotel-offer a{
    color: #ffffff;
    text-decoration: none;
}

.hotel-section h6.popular{
    position: absolute;
    background-color: #fdc700;
    left: 20px;
    top: 10px;
    padding: 6px 16px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    z-index: 999;
}

.hotel-section h6.popular a{
    color: #ffffff;
    text-decoration: none;
}


.hotel-content {
    padding: 15px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    margin-bottom: 30px;
    position: relative;
}

.hotel-content h5{
    font-family: "Poppins", serif;
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    margin-bottom: 10px;
}

.hotel-content h5 a{
    text-decoration: none;
    color: #101828;
}

.hotel-content h5 a:hover{
    color: #176DF2;
}

.hotel-content p span{
    float: right;
    font-size: 12px;
    font-weight: 400;
}

.hotel-content p span i{
    color: #fdc700;
    padding-right: 2px;
}

.hotel-content p{
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 10px;
}

.hotel-content ul{
    padding: 0px;
    margin: 0px;
    margin-bottom: 10px;
    position: absolute;
    top: -40px;
    z-index: 9;
}

.hotel-content ul li{
    list-style-type: none;
    display: inline-block;
    font-size: 12px;
    line-height: 14px;
    color: #4a5565;
    background-color: #f6f3f4;
    padding: 4px 8px;
    border-radius: 30px;
}


/**********TAB*********/

.hotel-section .nav-tabs{
    border-bottom: none;
}

.hotel-section .nav-tabs .nav-link{
    margin-bottom: 0px !important;
    border: none !important;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #1F1F1F;
}

.hotel-section .nav-tabs .nav-link.active{
    color: #176DF2;
}

.hotel-section .nav-tabs .nav-link:focus, .hotel-section .nav-tabs .nav-link:hover{
    border: none !important;
}

.guide-section .nav-tabs{
    border-bottom: none;
}

.guide-section .nav-tabs .nav-link{
    margin-bottom: 0px !important;
    border: none !important;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #1F1F1F;
}

.guide-section .nav-tabs .nav-link.active{
    color: #176DF2;
}

.guide-section .nav-tabs .nav-link:focus, .guide-section .nav-tabs .nav-link:hover{
    border: none !important;
}




















































/**************GUIDE SECTION*************/

.guide-section{
    padding: 30px 0;
    position: relative;
}

.guide-section a{
    text-decoration: none;
    position: relative;
}

.guide-img{
    position: relative;
}

.guide-section h4{
    font-family: "Poppins", serif;
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

.guide-section h4 a{
    text-align: right;
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #176DF2;
    float: right;
    text-decoration: none;
    position: relative;
    top: 0px;
    border: 3px solid #176DF2;
    padding: 8px 24px;
    border-radius: 30px;
}

.guide-section h4 a:hover{
    background-color: #176DF2;
    border: 3px solid #176DF2;
    color: #fff;
}

.guide-section img{
    height: 188px;
    width: 100%;
    object-fit: cover;
    /* border-radius: 12px 12px 0 0; */
    /* change */
    border-radius: 8px 8px 0 0;
}

.guide-section i.fa-regular.fa-heart {
    position: absolute;
    background-color: rgb(0 0 0 / 56%);
    right: 10px;
    top: 10px;
    padding: 10px;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    font-size: 16px;
    line-height: 17px;
    text-align: center;
    color: #fff;
    z-index: 999;
}

.guide-section i.fa-regular.fa-heart:hover{
    background-color: #fff;
    color: #176DF2;
}


.guide-section h6.certify{
    background-color: #155dfc;
}

.guide-section h6.popular{
    position: absolute;
    background-color: #176DF2;
    left: 20px;
    top: 10px;
    padding: 6px 16px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    z-index: 999;
}

.guide-section h6.popular a{
    color: #ffffff;
    text-decoration: none;
}

.guide-content {
    padding: 15px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    margin-bottom: 30px;
    position: relative;
}

.guide-content h5{
    font-family: "Poppins", serif;
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    margin-bottom: 10px;
}

.guide-content h5 a{
    color: #101828;
    text-decoration: none;
}

.guide-content h5 a:hover{
    color: #176DF2;
}

.guide-content h5 span{
    float: right;
    font-size: 12px;
    font-weight: 400;
}

.guide-content h5 span i{
    color: #fdc700;
    padding-right: 2px;
}

.guide-content p span{
    float: right;
    font-size: 12px;
    font-weight: 400;
}

.guide-content p span i{
    color: #fdc700;
    padding-right: 2px;
}

.guide-content p{
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 10px;
}

.guide-content ul{
    padding: 0px;
    margin: 0px;
    margin-bottom: 10px;
    position: absolute;
    top: -40px;
    z-index: 9;
}

.guide-content ul li{
    list-style-type: none;
    display: inline-block;
    font-size: 12px;
    line-height: 16px;
    color: #4a5565;
    background-color: #f6f3f4;
    padding: 4px 8px;
    border-radius: 30px;
}

/*************DISCOVER SECTION*************/

.discover-section{
    padding: 50px 0;
}

.discover-section h4{
    font-family: "Poppins", serif;
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    text-align: center;
    margin-bottom: 20px;
}

.discover-section p{
    max-width: 670px;
    width: 100%;
    margin: 0 auto;
    display: block;
    text-align: center;
    margin-bottom: 40px;
}

.discover-section ul{
    padding: 0px;
    margin: 0px;
    text-align: center;
}

.discover-section ul li{
    list-style-type: none;
    display: inline-block;
    width: 19%;
}

.discover-section ul li a{
    background-color: #f5f5f5;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 30px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    color: #101828;
    text-decoration: none;
    display: block;
    margin-right: 20px;
    text-align: left;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
}

.discover-section ul li a i{
    color: #176DF2;
    padding-right: 10px;
}

.discover-section ul li a:hover{
    background-color: #eff6ff;
    color: #176DF2;
    box-shadow: none;
}

a.btn.btn-load {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 10px 20px;
    font-family: "Poppins", serif;
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #fff;
    border-radius: 30px;
    max-width: 130px;
    width: 100%;
    margin: 0 auto;
    display: block;
}

a.btn.btn-load:hover{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}

/*****************SUBSCRIBE SECTION***************/

.subscribe-section{
    padding: 50px 0;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}

.subscribe-section h4 {
    font-family: "Poppins", serif;
    font-size: 40px;
    color: #1F1F1F;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 48px;
}

.subscribe-section p{
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: #1F1F1F;
    margin-bottom: 0px;
}

.subscribe-section form{
    float: right;
    margin-top: 30px;
}

.subscribe-section form input{
    border: 1px solid #ccc;
    padding: 10px;
    height: 58px;
    font-size: 14px;
    width: 188px;
    margin-right: -6px;
    border-radius: 10px 0 0 10px;
}

.subscribe-section form button{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 15px 50px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #fff;
    border-radius: 0 10px 10px 0;
    position: relative;
    top: 2px;
}

/******************FOOTER**************/

.row.top-footer-rows{
    padding: 50px 0;
}

.row.top-footer-rows p{
    padding-right: 110px;
    font-size: 14px;
    line-height: 20px;
}

ul.footer-socials{
    padding: 0px;
    margin: 0px;
}

ul.footer-socials li{
    list-style-type: none;
    display: inline-block;
    padding-right: 20px;
}

ul.footer-socials li i{
    color: #99a1af;
    font-size: 18px;
}

ul.footer-socials li i:hover{
    color: #176DF2;
}

.row.top-footer-rows h5{
    font-family: "Poppins", serif;
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 20px;
}

.quicks ul{
    padding: 0px;
    margin: 0px;
}

.quicks ul li{
    list-style-type: none;
    padding-bottom: 10px;
}

.quicks ul li a{
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #1F1F1F;
    text-decoration: none;
}

.quicks ul li a:hover{
    color: #176DF2;
}

.row.mid-footer-rows{
    background-color: #176DF2;
    padding: 20px 5px;
    border-radius: 10px;
    margin-bottom: 50px;
    margin-left: 0px;
    margin-right: 0px;
}

.row.mid-footer-rows h4 {
    font-family: "Poppins", serif;
    font-size: 30px;
    color: #fff;
    margin-bottom: 5px;
    font-weight: 700;
    line-height: 34px;
}

.row.mid-footer-rows p {
    font-size: 16px;
    color: #fff;
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 0px;
}

a.btn.btn-partner {
    font-family: "Poppins", serif;
    border: 1px solid #fff;
    background-color: #fff;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #176DF2;
    float: right;
    margin-top: 6px;
}

.row.bootom-footer-rows{
    padding: 30px 0;
    border-top: 1px solid #e5e5e5;
    margin-left: 0px;
    margin-right: 0px;
    text-align: center;
}

.row.bootom-footer-rows p{
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 18px;
}






/*************BACK TO TOP**************/

.scroll-top-wrapper.show {
    visibility: visible;
    cursor: pointer;
    opacity: 1.0;
}

.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 9;
    background-color: #e40031;
    color: #fff;
    width: 45px;
    height: 44px;
    line-height: 7px;
    right: 15px;
    bottom: 60px;
    padding-top: 12px;
    border-radius: 50%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.scroll-top-wrapper i.fa {
    line-height: inherit;
    font-size: 26px;
}

.scroll-top-wrapper h5{
    margin-top: 0px;
    font-weight: 300;
    font-size: 12px;
}

/**************DESTINATION PAGE START HERE*************/

.destination-header{
    padding: 50px 0;
}

.destination-header h1{
    font-size: 40px;
    line-height: 46px;
    font-weight: 700;
    color: #101828;
    text-align: center;
    margin-bottom: 20px;
}

.destination-header p{
    text-align: center;
    color: #4a5565;
}

.desti-list-section{
    padding-bottom: 50px;
    position: relative;
}

.desti-list-section h2{
    font-size: 30px;
    line-height: 34px;
    font-weight: 700;
    color: #101828;
    margin-bottom: 5px;
}

.desti-list-section h2 i{
    color: #176DF2;
    padding-right: 5px;
}

.desti-boxs{
    position: relative;
    margin-bottom: 30px;
    transition: all 0.3s ease;
}

.desti-boxs:hover{
    transform: translateY(-4px);
}

.desti-list-section img{
    width: 100%;
    height: 188px;
    object-fit: cover;
    position: relative;
}

.desti-list-box{
    padding: 20px;
    border: 1px solid #e5e5e5;
    border-radius: 0 0 10px 10px;
}

span.eco {
    position: absolute;
    background-color: #155dfc;
    right: 10px;
    top: 10px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #fff;
    border-radius: 30px;
    z-index: 999;
}

.desti-list-box h4{
    font-size: 22px;
    line-height: 26px;
    font-weight: 600;
    margin-bottom: 10px;
}

.desti-list-box h4 a{
    color: #101828;
    text-decoration: none;
}

.desti-list-box h4 a:hover{
    color: #176DF2;
}

.desti-list-box p{
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 10px;
}

span.prolists{
    font-size: 14px;
    line-height: 18px;
    color: #6a7282;
    margin-bottom: 10px;
    float: left;
}

.desti-list-box h6{
    font-size: 14px;
    line-height: 18px;
    color: #99a1af;
    margin-bottom: 10px;
    text-align: right;
}

.desti-list-box h6 i{
    color: #fdc700;
    padding-right: 5px;
}

.desti-list-box h6 span{
    color: #fdc700;
    padding-right: 5px;
}

.desti-list-box ul {
    padding: 0px;
    margin: 0px;
}

.desti-list-box ul li {
    list-style-type: none;
    display: inline-block;
}

.desti-list-box ul li a{
    font-size: 10px;
    line-height: 14px;
    font-weight: 600;
    color: #176DF2;
    background-color: #dfecff;
    padding: 4px 6px;
    border-radius: 30px;
    display: block;
    text-decoration: none;
}

.summer-section{
    padding-bottom: 50px;
}

.summer-section .row{
    background: url("../images/summer-bg.PNG") top center no-repeat;
    width: 100%;
    background-size: cover;
    margin-left: 0px;
    margin-right: 0px;
    padding: 50px 0;
    border-radius: 20px;
    text-align: center;
}

.summer-section h3{
    font-size: 40px;
    line-height: 46px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin-bottom: 20px;
}

.summer-section p{
    font-weight: 600;
    color: #fff;
    font-size: 18px;
    margin-bottom: 20px;
}

a.btn.btn-explore {
    border: 1px solid #fff;
    background-color: #fff;
    padding: 10px 30px;
    border-radius: 30px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    color: #176DF2;
}

a.btn.btn-explore:hover{
    border: 1px solid #fff;
    background-color: #fff;
    color: #176DF2;
}

a.btn.btn-explore i{
    padding-left: 10px;
}

/******COUNTER******/

#counter-stats {
    display: flex;
    justify-content: center;
}

.stats {
    text-align: center;
    background-color: #fff;
    font-size: 30px;
    font-weight: 700;
    box-shadow: 0px 4px 6px -4px rgba(0, 0, 0, 0.1), 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    padding: 40px;
    border-radius: 30px;
    color: #000;
    border: 1px solid #F6F6F6;
    margin-bottom: 30px;
}

.stats i{
    color: #176DF2;
    font-size: 24px;
    display: block;
    background-color: #dfecff;
    padding: 10px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    line-height: 53px;
    margin: 0 auto;
    margin-bottom: 15px;
}

.stats .counting{
    display: inline-block;
    margin-bottom: 10px;
}

.stats h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #000;
    margin-bottom: 0px;
}

/********SEARCH PAGE START HERE********/


.clickmenus1{
    font-size: 16px;
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: 0px;
    color: #fff;
    z-index: 99;
    display: none;
    float: left;
    background-color: #176DF2;
    padding: 4px 15px;
    border-radius: 5px;
}

.clickmenus1 h6{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #dc3545;
    text-transform: uppercase;
    float: right;
    margin-left: 10px;
}

.sidenav1 {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  background: #fff;
  overflow-x: hidden;
  transition: 0.5s;
}


.sidenav1 .closebtn1 {
    position: absolute;
    top: 8px;
    right: 11px;
    font-size: 30px;
    z-index: 9999;
    padding: 0px;
    color: #176DF2;
    text-decoration: none;
}

@media screen and (max-height: 450px) {
  .sidenav1 a {font-size: 18px;}
}


.sidenav1 .card{
    background-color: transparent;
    border: none;
}


.card-header{
  background-color: transparent;
  border-bottom: 1px solid #eee;
}

.sidenav1 .card-body{
    padding: 0 10px;
}


.mobile-menus ul li a i.fa{
    float: right;
    margin-top: 5px;
}


@media(max-width: 992px)
{
  .clickmenus1{
    display: block;
    top: 61px;
    left: 10px;
  }

  /*.fixed-top .clickmenus {
    top: 29px;
    z-index: 9;
  }*/
}



















.filters-sidebar {
    flex: 0 0 280px;
    background: white;
    padding: 40px 0;
    /*box-shadow: 0 2px 10px rgba(0,0,0,0.08);*/
    /*height: fit-content;
    border-radius: 10px;
    position: sticky;
    top: 20px;
    height: 900px;
    overflow-y: auto;*/
}

.filter-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    color: #2c3e50;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
}

.filter-section{
    margin-bottom: 10px;
}

.filter-heading {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #555;
}

.filter-section .star-rating {
    display: flex;
    gap: 15px;
}

.filter-section .star {
    font-size: 24px;
    color: #8b8b8b;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
}

.filter-section .star:hover,
.filter-section .star.active {
    color: #ffd700;
    transform: scale(1.1);
}

.filter-section .star:hover ~ .star {
    color: #ddd;
    transform: scale(1);
}

@media (max-width: 480px) {
    .filter-section .star {
        font-size: 2.5rem;
    }
}

.filter-option {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    cursor: pointer;
    transition: color 0.2s;
    font-size: 12px;
}

.filter-option:hover {
    color: #176DF2;
}

.filter-checkbox {
    margin-right: 10px;
    width: 16px;
    height: 16px;
    accent-color: #176DF2;
}

.filters-sidebar .star-rating {
    color: #ffd700;
    margin-left: 5px;
    font-size: 12px;
}


/**********RANGE SLIDER**********/

.wrapper {
  width: 100%;
  margin-bottom: 20px;
}

.wrapper h4 {
    font-size: 18px;
    font-weight: 600;
    color: #2c3e50;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
}


.wrapper header p {
      margin-top: 5px;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0px;
}
.price-input {
  width: 100%;
  display: flex;
  margin: 14px 0 20px;
}
.price-input .field {
  display: flex;
  width: 100%;
  height: 30px;
  align-items: center;
}
.field input {
  width: 100%;
  height: 100%;
  outline: none;
  font-size: 14px;
  margin-left: 12px;
  border-radius: 5px;
  text-align: center;
  border: 1px solid #999;
  -moz-appearance: textfield;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.price-input .separator {
  width: 130px;
  display: flex;
  font-size: 19px;
  align-items: center;
  justify-content: center;
}
.slider {
  height: 5px;
  position: relative;
  background: #ddd;
  border-radius: 5px;
}
.slider .progress {
  height: 100%;
  left: 5%;
  right: 25%;
  position: absolute;
  border-radius: 5px;
  background: #17a2b8;
}
.range-input {
  position: relative;
}
.range-input input {
  position: absolute;
  width: 100%;
  height: 5px;
  top: -5px;
  background: none;
  pointer-events: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
input[type="range"]::-webkit-slider-thumb {
  height: 17px;
  width: 17px;
  border-radius: 50%;
  background: #17a2b8;
  pointer-events: auto;
  -webkit-appearance: none;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}
input[type="range"]::-moz-range-thumb {
  height: 17px;
  width: 17px;
  border: none;
  border-radius: 50%;
  background: #17a2b8;
  pointer-events: auto;
  -moz-appearance: none;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}







/*************PARTNER REGISTRATION PAGE START HERE************/





.partner-registration-section .container-fluid {
    display: flex;
    min-height: 100vh;
}

 /* Sidebar Styles */
.partner-registration-section.sidebar {
    width: 320px;
    /*background-color: #2c3e50;*/
    color: white;
    padding: 10px 20px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.partner-registration-section.sidebar h2 {
    font-size: 20px;
    margin-bottom: 30px;
    font-weight: 500;
}

.partner-registration-section .steps {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.partner-registration-section .step {
    margin-bottom: 20px;
    padding: 12px 15px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
}

.partner-registration-section .step.active {
    border: 1px solid #176DF2;
    color: #176DF2;
}

.partner-registration-section .step.completed {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}

.partner-registration-section .step.disabled {
    /*opacity: 0.5;*/
    cursor: not-allowed;
    color: #99a1af;
}

.partner-registration-section .step i {
    margin-right: 10px;
    font-size: 16px;
}

/* Main Content Styles */
.partner-registration-section .main-content {
    flex: 1;
    padding: 40px;
    display: flex;
    flex-direction: column;
}

/* Progress Bar Styles */
.partner-registration-section .progress-container {
    margin-bottom: 30px;
}

.partner-registration-section .progress-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.partner-registration-section .progress-title {
    font-size: 16px;
    font-weight: 500;
    color: #2c3e50;
}

.partner-registration-section .progress-percentage {
    font-size: 16px;
    font-weight: 600;
    color: #176DF2;
}

.partner-registration-section .progress-bar {
    width: 100%;
    height: 10px;
    background-color: #ecf0f1;
    border-radius: 5px;
    overflow: hidden;
}

.partner-registration-section .progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #176DF2, #2980b9);
    border-radius: 5px;
    transition: width 0.5s ease;
    position: relative;
}

.partner-registration-section .progress-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.3) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

.partner-registration-section .content-header {
    margin-bottom: 40px;
}

.partner-registration-section .content-header h1 {
    font-size: 28px;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 10px;
}

.partner-registration-section .content-header p {
    color: #7f8c8d;
    font-size: 16px;
}

/* Options Section */
.partner-registration-section .options-container {
    display: flex;
    gap: 25px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.partner-registration-section .option-card {
    flex: 1;
    min-width: 250px;
    background-color: white;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    text-align: center;
}

.partner-registration-section .option-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.partner-registration-section .option-card.selected {
    border-color: #176DF2;
    background-color: #f0f9ff;
}

.partner-registration-section .option-icon {
    font-size: 48px;
    margin-bottom: 20px;
    color: #176DF2;
}

.partner-registration-section .option-card h3 {
    font-size: 20px;
    margin-bottom: 10px;
    color: #2c3e50;
}

.partner-registration-section .option-card p {
    color: #7f8c8d;
    font-size: 14px;
}

/* Form Section */
.partner-registration-section .form-section {
    display: none;
    background-color: white;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    margin-bottom: 40px;
}

.partner-registration-section .form-section.active {
    display: block;
}

.partner-registration-section .form-group {
    margin-bottom: 20px;
}

.partner-registration-section .form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #2c3e50;
}

.partner-registration-section .form-group input,
.partner-registration-section .form-group select,
.partner-registration-section .form-group textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 16px;
    transition: border-color 0.3s;
}

.partner-registration-section .form-group input:focus,
.partner-registration-section .form-group select:focus,
.partner-registration-section .form-group textarea:focus {
    outline: none;
    border-color: #176DF2;
}

.partner-registration-section .form-group.error input,
.partner-registration-section .form-group.error select,
.partner-registration-section .form-group.error textarea {
    border-color: #e74c3c;
}

.partner-registration-section .error-message {
    color: #e74c3c;
    font-size: 14px;
    margin-top: 5px;
    display: none;
}

.partner-registration-section .form-group.error .error-message {
    display: block;
}

.partner-registration-section .form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.partner-registration-section .form-row .form-group {
    flex: 1;
    margin-bottom: 0;
}

.partner-registration-section .tag-input-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 6px;
    min-height: 45px;
    cursor: text;
}

.partner-registration-section .tag-input-container:focus-within {
    border-color: #176DF2;
}

.partner-registration-section .tag {
    background-color: #176DF2;
    color: white;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 14px;
    display: flex;
    align-items: center;
}

.partner-registration-section .tag .remove-tag {
    margin-left: 8px;
    cursor: pointer;
}

.partner-registration-section .tag-input {
    border: none;
    outline: none;
    flex: 1;
    min-width: 120px;
    padding: 5px;
}

/* Social Profiles Section */
.partner-registration-section .social-section {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #eee;
}

.partner-registration-section .social-section h3 {
    font-size: 20px;
    margin-bottom: 20px;
    color: #2c3e50;
    display: flex;
    align-items: center;
}

.partner-registration-section .social-section h3 i {
    margin-right: 10px;
    color: #176DF2;
}

.partner-registration-section .social-input-group {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.partner-registration-section .social-input-group .social-icon{
    background-color: #dfecff;
    color: #176DF2;
    border-radius: 6px 0 0 6px;
    padding: 11px 20px;
}

.partner-registration-section .social-input-group .partner-registration-section .social-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    border-radius: 6px 0 0 6px;
    border: 1px solid #ddd;
    border-right: none;
    color: #7f8c8d;
}

.social-input-group input {
    border-radius: 0 6px 6px 0;
    border: 1px solid #ccc;
    padding: 10px;
    width: 100%;
}

/* Accordion Styles */
.partner-registration-section .accordion {
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    margin-bottom: 40px;
}

.partner-registration-section .accordion-item {
    border-bottom: 1px solid #eee;
}

.partner-registration-section .accordion-item:last-child {
    border-bottom: none;
}

.partner-registration-section .accordion-header {
    padding: 20px 30px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s;
}

.partner-registration-section .accordion-header:hover {
    background-color: #f8f9fa;
}

.partner-registration-section .accordion-header h3 {
    font-size: 18px;
    color: #2c3e50;
    margin: 0;
    display: flex;
    align-items: center;
}

.partner-registration-section .accordion-header h3 i {
    margin-right: 10px;
    color: #176DF2;
}

.partner-registration-section .accordion-icon {
    transition: transform 0.3s;
    color: #7f8c8d;
}

.partner-registration-section .accordion-item.active .accordion-icon {
    transform: rotate(180deg);
}

.partner-registration-section .accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.partner-registration-section .accordion-item.active .accordion-content {
    max-height: 2000px;
}

.partner-registration-section .accordion-body {
    padding: 0 30px 30px;
}

.partner-registration-section .review-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.partner-registration-section .review-item {
    margin-bottom: 15px;
}

.partner-registration-section .review-item label {
    font-weight: 600;
    color: #7f8c8d;
    display: block;
    margin-bottom: 5px;
}

.partner-registration-section .review-item p {
    margin: 0;
    color: #2c3e50;
}

.partner-registration-section .social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.partner-registration-section .social-link {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    background-color: #f8f9fa;
    border-radius: 20px;
    font-size: 14px;
}

.partner-registration-section .social-link i {
    margin-right: 5px;
}

/* Buttons */
.partner-registration-section .buttons {
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}

.partner-registration-section .btn {
    padding: 12px 30px;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
}

.partner-registration-section .btn-previous {
    background-color: #ecf0f1;
    color: #7f8c8d;
}

.partner-registration-section .btn-previous:hover {
    background-color: #d5dbdb;
}

.partner-registration-section .btn-next {
    background-color: #176DF2;
    color: white;
}

.partner-registration-section .btn-next:hover {
    background-color: #2980b9;
}

.partner-registration-section .btn-next:disabled {
    background-color: #a9cce3;
    cursor: not-allowed;
}

.partner-registration-section .btn-submit {
    background-color: #27ae60;
    color: white;
}

.partner-registration-section .btn-submit:hover {
    background-color: #229954;
}

/* Toast Notification */
.partner-registration-section .toast {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #2c3e50;
    color: white;
    padding: 15px 25px;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(100px);
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 1000;
}

.partner-registration-section .toast.show {
    transform: translateY(0);
    opacity: 1;
}

.partner-registration-section .toast.error {
    background-color: #e74c3c;
}

.partner-registration-section .toast.success {
    background-color: #27ae60;
}

/* Responsive Design */


/*************SIGN IN PAGE START HERE************/



.signin-section .signin-column {
    display: flex;
    height: 100vh;
}

.signin-section .branding {
    flex: 1;
    background: linear-gradient(135deg, #176DF2, #0d47a1);
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 4rem;
    position: relative;
    overflow: hidden;
}

.signin-section .branding::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://images.unsplash.com/photo-1503220317375-aaad61436b1b?ixlib=rb-4.0.3&auto=format&fit=crop&w=1950&q=80');
    background-size: cover;
    background-position: center;
    opacity: 0.15;
    z-index: 0;
}

.signin-section .branding-content {
    position: relative;
    z-index: 1;
    max-width: 500px;
}

.signin-section .logo {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
    letter-spacing: -0.5px;
}

.signin-section .tagline {
    font-size: 1.5rem;
    font-weight: 300;
    margin-bottom: 2rem;
    line-height: 1.4;
}

.signin-section .description {
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 3rem;
    opacity: 0.9;
    color: #fff;
}

.signin-section .trust-indicators {
    display: flex;
    gap: 2rem;
    margin-top: 1rem;
}

.signin-section .trust-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.signin-section .trust-item i {
    font-size: 1.2rem;
    color: #ffeb3b;
}

.signin-section .trust-text {
    font-size: 0.9rem;
}

.signin-section .trust-number {
    font-weight: 700;
    font-size: 1.1rem;
}

/* Right Panel - Login Form */
.signin-section .login-container {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f9f9f9;
    padding: 2rem;
}

.signin-section .login-form {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    padding: 2.5rem;
    width: 100%;
}

.signin-section .login-header {
    margin-bottom: 2rem;
}

.signin-section .login-title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
}

.signin-section .login-subtitle {
    color: #666;
    font-size: 0.95rem;
}

.signin-section .form-group {
    margin-bottom: 1.5rem;
}

.signin-section .form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #444;
    font-size: 0.9rem;
}

/* Input field with icon container */
.signin-section .input-container {
    position: relative;
}

.signin-section .input-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
    font-size: 1.1rem;
}

.signin-section .form-input {
    width: 100%;
    padding: 0.85rem 1rem 0.85rem 3rem;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.signin-section .form-input:focus {
    outline: none;
    border-color: #176DF2;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.1);
}

/* Password input container with toggle icon */
.signin-section .password-container {
    position: relative;
}

.signin-section .password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #666;
    cursor: pointer;
    font-size: 1.1rem;
    padding: 0;
    transition: color 0.3s ease;
}

.signin-section .password-toggle:hover {
    color: #176DF2;
}

.signin-section .btn-primary {
    background: #176DF2;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 0.85rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    transition: background 0.3s ease;
    margin-top: 0.5rem;
}

.signin-section .btn-primary:hover {
    background: #0d47a1;
}

.signin-section .form-footer {
    display: flex;
    justify-content: space-between;
    margin-top: 1.5rem;
    font-size: 0.9rem;
}

.signin-section .form-footer a {
    color: #176DF2;
    text-decoration: none;
    font-weight: 500;
}

.signin-section .form-footer a:hover {
    text-decoration: underline;
}

.signin-section .divider {
    display: flex;
    align-items: center;
    margin: 1.5rem 0;
    color: #888;
    font-size: 0.85rem;
}

.signin-section .divider::before,
.signin-section .divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #eee;
}

.signin-section .divider span {
    padding: 0 1rem;
}

.signin-section .social-login {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.signin-section .btn-social {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.9rem;
    font-weight: 500;
}

.signin-section .btn-social:hover {
    background: #f5f5f5;
}

.signin-section .btn-google {
    color: #4285F4;
}

.signin-section .btn-facebook {
    color: #1877F2;
}

.signin-section .terms {
    text-align: center;
    margin-top: 1.5rem;
    font-size: 0.8rem;
    color: #777;
    line-height: 1.5;
}

.signin-section .terms a {
    color: #176DF2;
    text-decoration: none;
}

.signin-section .terms a:hover {
    text-decoration: underline;
}



/************SIGN UP PAGE STRAT HERE***********/





.signup-section .signup-column {
    display: flex;
    width: 100%;
}

/* Left Section */
.signup-section .left-section {
    flex: 1;
    background: linear-gradient(135deg, #0052cc, #0066ff);
    color: white;
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.signup-section .brand {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.signup-section .brand i {
    margin-right: 10px;
    font-size: 28px;
}

.signup-section .title {
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 1.2;
}

.signup-section .description {
    font-size: 18px;
    margin-bottom: 40px;
    opacity: 0.9;
    line-height: 1.6;
    color: #fff;
}

.signup-section .trust-indicators {
    margin-top: 20px;
}

.signup-section .trust-item {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.signup-section .trust-item i {
    margin-right: 15px;
    font-size: 20px;
    color: #4cd964;
}

.signup-section .trust-text {
    font-size: 16px;
}

/* Right Section */
.signup-section .right-section {
    flex: 1;
    background-color: white;
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.signup-section .form-container {
    max-width: 450px;
    margin: 0 auto;
    width: 100%;
}

.signup-section .form-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #333;
}

.signup-section .form-subtitle {
    font-size: 16px;
    color: #666;
    margin-bottom: 30px;
}

.signup-section .form-group {
    margin-bottom: 20px;
    position: relative;
}

.signup-section .form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

.signup-section .input-wrapper {
    position: relative;
}

.signup-section .input-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #777;
    font-size: 18px;
}

.signup-section .form-group input {
    width: 100%;
    padding: 14px 16px 14px 45px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 16px;
    transition: border 0.3s;
}

.signup-section .form-group input:focus {
    border-color: #0066ff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
}

.signup-section .password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #777;
    font-size: 18px;
}

.signup-section .password-toggle:hover {
    color: #0066ff;
}

.signup-section .btn {
    background-color: #0066ff;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    transition: background-color 0.3s;
    margin-top: 10px;
}

.signup-section .btn:hover {
    background-color: #0052cc;
}

.signup-section .login-link {
    text-align: center;
    margin-top: 20px;
    font-size: 15px;
    color: #666;
}

.signup-section .login-link a {
    color: #0066ff;
    text-decoration: none;
    font-weight: 600;
}

.signup-section .login-link a:hover {
    text-decoration: underline;
}

.signup-section .terms {
    margin-top: 25px;
    font-size: 13px;
    color: #777;
    text-align: center;
}

.signup-section .terms a {
    color: #0066ff;
    text-decoration: none;
}

.signup-section .terms a:hover {
    text-decoration: underline;
}



/**************ROOM LISTING PAGE START HERE*************/

.room-list-section{
    padding: 50px 0;
}

.room-list-rows{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    margin-left: 0px;
    margin-right: 0px;
    border-radius: 20px;
    position: relative;
    margin-bottom: 30px;
}

.room-list-col-left{
    padding-left: 0px;
}

.room-list-col-left img{
    height: 180px;
    border-radius: 20px 0 0 20px;
    width: 100%;
    object-fit: cover;
}

.room-list-col-right{
    padding-top: 10px;
    position: relative;
    padding-right: 20px;
}

.room-list-col-right h4{
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    margin-bottom: 5px;
    display: inline-block;
}

.room-list-col-right h4 a{
    text-decoration: none;
    color: #101828;
}

.room-list-col-right h4 a:hover{
    color: #176DF2;
}

.room-list-col-right h4 span{
    float: right;
    position: relative;
    top: 0px;
    background-color: #066200;
    padding: 6px 6px;
    border-radius: 5px;
    font-size: 10px;
    line-height: 12px;
    font-weight: 600;
    color: #fff;
    margin-left: 10px;
}

.room-list-col-right select{
    float: right;
    border: 1px solid #ddd;
    padding: 2px 5px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 12px;
}

.room-list-col-right p{
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 20px;
    display: inline-block;
}

.detail-choose .room-list-col-right h5 {
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    color: #111;
    margin-bottom: 0px;
    display: inline-block;
}

.room-list-col-right ul{
    padding: 0px;
    margin: 0px;
}

.room-list-col-right ul li{
    list-style-type: none;
    display: inline-block;
    margin-right: 10px;
    color: #4a5565;
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
}

.room-list-col-right ul li i{
    color: #176DF2;
    padding-right: 2px;
}

.room-list-col-right h6{
    position: absolute;
    bottom: 10px;
    font-size: 18px;
    line-height: 30px;
    font-weight: 700;
    color: #176DF2;
    width: 100%;
    margin-bottom: 0px;
}

.room-list-col-right h6 a{
    float: right;
    background-color: #176DF2;
    padding: 6px 12px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    color: #fff;
    border-radius: 10px;
    text-decoration: none;
    margin-right: 30px;
}

/*************CAREER PAGE START HERE*************/



#jobs.jobs .jobs {
    padding: 3rem 1rem;
    background: white;
}

#apply .section-header,
#jobs.jobs .section-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

#apply .section-header h2,
#jobs.jobs .section-header h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

#apply .section-header p,
#jobs.jobs .section-header p {
    font-size: 1.125rem;
    color: #4b5563;
}

#jobs.jobs .job-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

#jobs.jobs .job-card {
    background: #f9fafb;
    padding: 1.5rem;
    border-radius: 0.75rem;
    border: 2px solid transparent;
    transition: all 0.3s;
}

#jobs.jobs .job-card:hover {
    border-color: #176DF2;
    transform: translateX(5px);
}

#jobs.jobs .job-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

#jobs.jobs .job-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

#jobs.jobs .job-icon i {
    font-size: 1.25rem;
}

#jobs.jobs .job-type {
    font-size: 0.875rem;
    color: #6b7280;
}

#jobs.jobs .job-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

#jobs.jobs .job-title a{
    color: #4b5563;
    text-decoration: none;
}

#jobs.jobs .job-title a:hover{
    color: #176DF2;
}

#jobs.jobs .job-description {
    color: #4b5563;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

#jobs.jobs .job-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

#jobs.jobs .tag {
    font-size: 0.75rem;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
}

#jobs.jobs .job-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#jobs.jobs .job-location {
    font-size: 0.875rem;
    color: #6b7280;
}

#jobs.jobs .job-apply {
    color: #176DF2;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
}

#jobs.jobs .job-apply:hover {
    color: #764ba2;
}

/* Application Process */
#apply.process {
    padding: 3rem 1rem;
    background: #f9fafb;
}

#apply .process-content {
    max-width: 800px;
    margin: 0 auto;
}

#apply .timeline {
    position: relative;
}

#apply .timeline::before {
    content: '';
    position: absolute;
    left: 2rem;
    top: 0;
    bottom: 0;
    width: 0.25rem;
    background: #d1d5db;
}

#apply .timeline-item {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 2.5rem;
    position: relative;
}

#apply .timeline-number {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 1.25rem;
    flex-shrink: 0;
    z-index: 1;
}

#apply .timeline-content h3 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

#apply .timeline-content p {
    color: #4b5563;
    font-size: 0.875rem;
}

#apply .process-cta {
    text-align: center;
    margin-top: 3rem;
}

.process-cta .btn-primary {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    padding: 0.875rem 2rem;
    border-radius: 9999px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: box-shadow 0.3s;
    font-weight: 600;
    border: none;
    cursor: pointer;
}

.process-cta .btn-primary:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

/* Modal */
#applicationModal.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 1rem;
}

#applicationModal .modal-content {
    background: white;
    border-radius: 1rem;
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

#applicationModal .modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

#applicationModal .modal-header h3 {
    font-size: 1.25rem;
    font-weight: 700;
}

#applicationModal .modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
}

#applicationModal .modal-body {
    padding: 1.5rem;
}

#applicationModal .form-group {
    margin-bottom: 1rem;
}

#applicationModal .form-group label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #374151;
}

#applicationModal .form-control {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 1rem;
    transition: border-color 0.3s;
}

#applicationModal .form-control:focus {
    outline: none;
    border-color: #176DF2;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

#applicationModal .form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

#applicationModal .btn {
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
    border: none;
    font-size: 1rem;
}

#applicationModal .btn-submit {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    flex: 1;
}

#applicationModal .btn-submit:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

#applicationModal .btn-cancel {
    background: white;
    color: #374151;
    border: 2px solid #d1d5db;
    flex: 1;
}

#applicationModal .btn-cancel:hover {
    border-color: #9ca3af;
}

/* Success Message */
#successMessage.success-message {
    position: fixed;
    top: 1rem;
    right: 1rem;
    background: #176DF2;
    color: white;
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    transform: translateX(400px);
    transition: transform 0.3s;
    z-index: 200;
    max-width: calc(100% - 2rem);
}

#successMessage.success-message.show {
    transform: translateX(0);
}























/**************HOTEL DETAILS PAGE START HERE*************/

.hotel-detail-section{
    padding-top: 30px;
}





/* Main Content */
.service-detail {
    display: flex;
    max-width: 1200px;
    margin: 0 auto;
    gap: 30px;
}

/* Left Column */
.service-content {
    flex: 7;
    background: white;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}
/*
.service-image {
    width: 100%;
    height: 400px;
    object-fit: cover;
}

.service-body {
    padding: 30px;
}

.service-title {
    font-size: 2.5rem;
    color: #1e293b;
    margin-bottom: 1rem;
}

.service-description {
    font-size: 1.125rem;
    color: #475569;
    margin-bottom: 2rem;
}

.service-section {
    margin-bottom: 2.5rem;
}

.section-title {
    font-size: 1.75rem;
    color: #1e293b;
    margin-bottom: 1.5rem;
    position: relative;
    padding-bottom: 0.75rem;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
}

.feature-list {
    list-style: none;
}

.feature-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #e2e8f0;
}

.feature-item:last-child {
    border-bottom: none;
}

.feature-icon {
    color: #6366f1;
    font-size: 1.5rem;
    margin-right: 1rem;
    flex-shrink: 0;
}

.feature-content h3 {
    font-size: 1.25rem;
    color: #1e293b;
    margin-bottom: 0.5rem;
}

.feature-content p {
    color: #475569;
}

.process-steps {
    counter-reset: step-counter;
}

.process-step {
    display: flex;
    margin-bottom: 1.5rem;
    position: relative;
}

.process-step::before {
    counter-increment: step-counter;
    content: counter(step-counter);
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-right: 1.5rem;
    flex-shrink: 0;
}

.process-content {
    padding-top: 0.5rem;
}

.process-content h3 {
    font-size: 1.25rem;
    color: #1e293b;
    margin-bottom: 0.5rem;
}

.process-content p {
    color: #475569;
}*/

/* Right Column - Sidebar */
.service-sidebar {
    flex: 3;
    position: sticky;
    top: 105px;
    height: fit-content;
}
/*
.sidebar-card {
    background: white;
    border-radius: 16px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.sidebar-title {
    font-size: 1.25rem;
    color: #1e293b;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.service-list {
    list-style: none;
}

.service-list-item {
    padding: 0.75rem 0;
    border-bottom: 1px solid #e2e8f0;
}

.service-list-item:last-child {
    border-bottom: none;
}

.service-list-item a {
    display: flex;
    align-items: center;
    color: #475569;
    text-decoration: none;
    transition: color 0.3s ease;
}

.service-list-item a:hover {
    color: #6366f1;
}

.service-list-item i {
    margin-right: 0.75rem;
    color: #6366f1;
}

.sidebar-cta {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: white;
    border-radius: 16px;
    padding: 1.5rem;
    text-align: center;
}

.sidebar-cta h3 {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
}

.sidebar-cta p {
    margin-bottom: 1.25rem;
    opacity: 0.9;
}

.sidebar-cta .cta-button {
    background: white;
    color: #6366f1;
    padding: 0.75rem 1.5rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sidebar-cta .cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}*/

/* Responsive Design */























.breadcrumb{
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 10px;
}

.breadcrumb li{
    padding-right: 10px;
    margin-right: 10px;
    border-right: 1px solid #4a5565;
    line-height: 10px;
    color: #4a5565;
    font-size: 12px;
}

.breadcrumb li:last-child{
    border-right: none;
}

.breadcrumb li a{
    line-height: 10px;
    color: #4a5565;
    font-size: 12px;
    text-decoration: none;
}

.hotel-detail-content h1{
    font-size: 30px;
    line-height: 34px;
    font-weight: 700;
    color: #101828;
    margin-bottom: 15px;
}

.hotel-detail-content h6{
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 10px;
}

.hotel-detail-content h6 i{
    color: #fdc700;
}

.hotel-detail-content p{
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 10px;
}

.hotel-detail-content ul{
    padding: 0px;
    margin: 0px;
    margin-bottom: 25px;
}

.hotel-detail-content ul li{
    list-style-type: none;
    display: inline-block;
    margin-right: 20px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
}

.hotel-detail-content ul li i{
    color: #176DF2;
    padding-right: 5px;
}




.room-list-rows {
  position: relative;
  cursor: default; /* Remove pointer cursor from the entire box */
  transition: all 0.3s ease;
  border: 2px solid transparent;
  padding: 10px;
  margin-bottom: 15px;
  overflow: hidden;
}

/* Vertical bar checkbox container */
.room-list-rows .room-checkbox-container {
    position: absolute;
    top: 0;
    left: -38px;
    height: 26px;
    width: 26px;
    z-index: 10;
    background-color: #fff;
    transition: background-color 0.3s ease;
    cursor: pointer;
}

/* Hide the actual checkbox */
.room-list-rows .room-checkbox {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Label for the checkbox (the vertical bar) */
.room-list-rows .room-checkbox-label {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
  border: 2px solid #007bff;
  background-color: #fff;
}

/* Style when checkbox is checked */
.room-list-rows .room-checkbox:checked + .room-list-rows .room-checkbox-label {
  background-color: #007bff; /* Blue color when selected */
}

/* Hover effect on the bar */
.room-list-rows .room-checkbox-label:hover {
  background-color: rgba(0, 123, 255, 0.3);
}

/* Style for the entire room box when selected */
.room-list-rows .room-list-rows.room-selected {
  border-color: #007bff;
  background-color: rgba(0, 123, 255, 0.05);
  box-shadow: 0 0 10px rgba(0, 123, 255, 0.1);
}

/* Checkmark icon inside the bar when selected */
.room-checkbox:checked + .room-checkbox-label::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000;
  font-weight: bold;
  font-size: 14px;
}

















.portfolio-item.row {
    height: auto !important;
}

.hotel-img-left figure {
    position: relative;
    width: 100%;
    height: 420px;
    margin: 0 auto;
    display: block;
    overflow: hidden;
    margin-bottom: 30px;
}

.hotel-img-left figure img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    -o-object-fit: cover;
    object-fit: cover;
    transition: -webkit-transform .2s ease;
    transition: transform .2s ease;
    transition: transform .2s ease,-webkit-transform .2s ease;
    -webkit-transition: transform .2s ease;
    -moz-transition: transform ease .2s;
    -ms-transition: transform ease .2s;
}

.hotel-img-left figure img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.hotel-img-right figure {
    position: relative;
    width: 100%;
    height: 195px;
    margin: 0 auto;
    display: block;
    overflow: hidden;
    margin-bottom: 30px;
}

.hotel-img-right figure img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    -o-object-fit: cover;
    object-fit: cover;
    transition: -webkit-transform .2s ease;
    transition: transform .2s ease;
    transition: transform .2s ease,-webkit-transform .2s ease;
    -webkit-transition: transform .2s ease;
    -moz-transition: transform ease .2s;
    -ms-transition: transform ease .2s;
}

.hotel-img-right figure img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}


.offer-section .row{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.offer-lefts i{
    background-color: #dfecff;
    padding: 10px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
    font-size: 16px;
    line-height: 19px;
    width: 36px;
    height: 36px;
    text-align: center;
    color: #176DF2;
}

.offer-lefts h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #1e2939;
    margin-bottom: 0px;
}

.offer-lefts h5 span{
    color: #6a7282;
    font-size: 14px;
    line-height: 18px;
    display: block;
}

.offer-mids h4{
    font-size: 24px;
    line-height: 28px;
    font-weight: 700;
    color: #101828;
    text-align: center;
    margin-bottom: 0px;
}

.offer-mids h4 span{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
}

.offer-mids h4 del{
    color: #6a7282;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
}

a.btn.btn-checked {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 8px 20px;
    border-radius: 15px;
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #fff;
    float: right;
}

a.btn.btn-checked:hover {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}


/*********TOGGLE CONTENT********/

.content-expand {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease;
}

.content-expand.show {
    max-height: 1000px; /* Adjust based on your content length */
}

.toggle-button {
    background-color: #176DF2;
    color: white;
    border: none;
    padding: 6px 10px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    transition: background-color 0.3s, transform 0.2s;
    display: inline-flex;
    align-items: center;
    line-height: 14px;
}

.toggle-button:hover {
    background-color: #176DF2;
}

.toggle-button:active {
    transform: scale(0.98);
}

.toggle-icon {
    margin-left: 5px;
    transition: transform 0.3s;
}

.toggle-icon.rotate {
    transform: rotate(180deg);
}












.hotel-details-contents{
    padding: 50px 0;
}

.detail-inclusion,
.detail-review,
.detail-faqs,
.detail-policy,
.detail-choose,
.detail-aminity,
.detail-about{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 30px;
}

.detail-inclusion h4,
.detail-review h4,
.detail-faqs h4,
.detail-policy h4,
.detail-choose h3,
.detail-aminity h4,
.detail-about h4 {
    font-size: 34px;
    line-height: 40px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 20px;
}

.detail-about h6{
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: #1F1F1F;
    margin-bottom: 50px;
}

.content-container{
    margin-bottom: 40px;
}

.detail-about p {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
}

.detail-about ul.detail-about-lists{
    padding: 0px;
    margin: 0px;
}

.detail-about ul.detail-about-lists li{
    list-style-type: none;
    display: inline-block;
    width: 49%;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 15px;
}

.detail-about ul.detail-about-lists li i{
    color: #176DF2;
    padding-right: 5px;
}

.row.highlight-lists h5{
    font-size: 22px;
    line-height: 26px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #d1d5dc;
}

.row.highlight-lists ul{
    padding: 0px;
    margin: 0px;
}

.row.highlight-lists ul li{
    list-style-type: none;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 15px;
}

.row.highlight-lists ul li i{
    color: #176DF2;
    font-size: 8px;
    position: relative;
    top: -2px;
    padding-right: 5px;
}

.place-box{
    background-color: #fbf9fa;
    border: 1px solid #ebe6e7;
    border-radius: 10px;
    padding: 25px;
}

.detail-about .row.highlight-lists .place-box h6 {
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: #176DF2;
    margin-bottom: 20px;
}

.detail-about .row.highlight-lists .place-box p {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    color: #1F1F1F;
    margin-bottom: 5px;
}

.detail-about .row.highlight-lists .place-box p span{
    font-weight: 600;
}


.detail-aminity ul{
    padding: 0px;
    margin: 0px;
}

.detail-aminity ul li{
    list-style-type: none;
    display: inline-block;
    width: 31%;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 15px;
}

.detail-aminity ul li i{
    color: #176DF2;
    font-size: 6px;
    padding-right: 5px;
    position: relative;
    top: -3px;
}

.detail-choose h5{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #176DF2;
    margin-bottom: 20px;
}

.detail-policy h5{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #4a5565;
    margin-bottom: 10px;
}


.detail-review h5{
    line-height: 30px;
    margin-bottom: 30px;
}

.detail-review h5 span.name-title{
    background-color: #eff6ff;
    padding: 10px;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    font-size: 18px;
    color: #176DF2;
    display: block;
    float: left;
    text-align: center;
    margin-right: 10px;
    line-height: 27px;
}

.detail-review h5 span.review-user{
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    color: #4a5565;
    float: left;
    margin-right: 20px;
}

.detail-review h5 span.review-user span.review-date{
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: #4a5565;
    display: block;
}

.detail-review h5 a i{
    color: #fdc700;
    font-size: 20px;
    margin-right: 2px;
}

.detail-review p{
    margin-bottom: 40px;
}

.detail-inclusion h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #4a5565;
    margin-bottom: 10px;
}

ul.inclusion-lists{
    padding: 0px;
    margin: 0px;
}

ul.inclusion-lists li{
    list-style-type: none;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 15px;
}

ul.inclusion-lists li i{
    font-size: 10px;
    position: relative;
    top: -1px;
    color: #00bb00;
}

ul.exclusions-lists{
    padding: 0px;
    margin: 0px;
}

ul.exclusions-lists li{
    list-style-type: none;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 15px;
}

ul.exclusions-lists li i{
    font-size: 10px;
    position: relative;
    top: -1px;
    color: #ff0000;
}


.detail-faqs .accordion-container{
  position: relative;
  max-width: 100%;
  width: 100%;
  /*float: left;*/

}
.detail-faqs .accordion-container > h2{
  text-align: center;
  color: #fff;
  padding-bottom: 5px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #fff;
}
.detail-faqs .set{
  position: relative;
  width: 100%;
  height: auto;
  background-color: #d1e3ff;
  box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -webkit-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -moz-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -ms-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
    margin-bottom: 15px;
    border-radius: 10px;
}
.detail-faqs .set > a{
  display: block;
    font-size: 16px;
    padding: 20px 20px;
    text-decoration: none;
    color: #282828;
    font-weight: 600;
    border: 1px solid #DDDDDD;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    transition: all 0.2s linear;
    border-radius: 5px;
    background-color: #fff;
}
.detail-faqs .set > a:hover{
    color: #176DF2;
    text-decoration: underline;
}
.detail-faqs .set > a i{
  float: right;
  margin-top: 2px;
}
.detail-faqs .set > a.active{
  background-color: #fff;
  color: #000;
}
.detail-faqs .set .content{
  background-color: #fff;
      border-radius: 0 0 10px 10px;
  display:none;
}
.detail-faqs .set .content p{
  padding: 10px 15px;
  margin: 0;
  color: #333;
}

.detail-faqs .set .content .row{
    margin-left: 0px;
    margin-right: 0px;
}

.detail-faqs .set .content .row p{
    padding-left: 0px;
}

.detail-faqs .set .content .row h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #000;
    margin-bottom: 10px;
}

.detail-faqs .set .content .row ul{
    padding: 0px;
    margin: 0px;
}

.detail-faqs .set .content .row ul li{
    list-style-type: none;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 10px;
}

.detail-faqs .set .content .row ul li i {
    color: #176DF2;
    font-size: 8px;
    position: relative;
    top: -2px;
    padding-right: 5px;
}

.detail-faqs .set .content .row img{
    width: 100%;
    margin-top: 20px;
    border-radius: 10px;
}

/*.review-container {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    width: 100%;
    padding: 30px;
}*/

.review-title {
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 25px;
    color: #333;
    line-height: 34px;
}

.rating-section {
    margin-bottom: 25px;
}

.rating-label {
    font-size: 16px;
    margin-bottom: 10px;
    color: #555;
}

.star-rating {
    display: flex;
    font-size: 30px;
    cursor: pointer;
}

.star {
    color: #ddd;
    margin-right: 5px;
    transition: color 0.2s;
}

.star:hover,
.star.active {
    color: #ffc107;
}

.comment-section {
    margin-bottom: 25px;
}

.comment-textarea {
    width: 100%;
    min-height: 150px;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 16px;
    resize: vertical;
    color: #555;
}

.comment-textarea:focus {
    outline: none;
    border-color: #4d90fe;
    box-shadow: 0 0 0 2px rgba(77, 144, 254, 0.2);
}

.upload-section {
    margin-bottom: 25px;
}

.upload-label {
    font-size: 16px;
    margin-bottom: 10px;
    color: #555;
    display: block;
}

.upload-area {
    border: 2px dashed #ddd;
    border-radius: 4px;
    padding: 30px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s;
    background-color: #fafafa;
}

.upload-area:hover {
    border-color: #4d90fe;
    background-color: #f0f7ff;
}

.upload-icon {
    font-size: 40px;
    color: #aaa;
    margin-bottom: 10px;
}

.upload-text {
    color: #777;
    font-size: 16px;
}

.submit-btn {
    background-color: #4285f4;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 12px 24px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    width: 100%;
    transition: background-color 0.3s;
}

.submit-btn:hover {
    background-color: #3367d6;
}

.submit-btn:active {
    background-color: #2e56cc;
}

/* Responsive design */






.detail-right-booking,
.detail-right-availability{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 30px;
    margin-bottom: 30px;
}

.detail-right-booking h4,
.detail-right-availability h4 {
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 20px;
}

.detail-right-availability ul{
    padding: 0px;
    margin: 0px;
}

.detail-right-availability ul li{
    list-style-type: none;
    padding-bottom: 10px;
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    color: #4a5565;
}

.detail-right-availability ul li span{
    float: right;
}





.detail-right-booking .date-container {
    width: 100%;
    margin-bottom: 15px;
}

.detail-right-booking .form-label {
    display: block;
    margin-bottom: 2px;
    font-weight: 600;
    color: #202124;
}

.detail-right-booking .form-control {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #dadce0;
    border-radius: 6px;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.detail-right-booking .form-control:focus {
    outline: none;
    border-color: #176DF2;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.2);
}

/* Custom daterangepicker styles */
.detail-right-booking .daterangepicker {
    z-index: 9999 !important;
}

.detail-right-booking .daterangepicker .calendar-table {
    background: white;
}

.detail-right-booking .daterangepicker .calendar-table .next span, 
.detail-right-booking .daterangepicker .calendar-table .prev span {
    border-color: #176DF2;
}

.detail-right-booking .daterangepicker td.in-range {
    background-color: #e8f0fe;
    color: #176DF2;
}

.detail-right-booking .daterangepicker td.active, 
.detail-right-booking .daterangepicker td.active:hover {
    background-color: #176DF2;
}

.detail-right-booking .daterangepicker select.monthselect, 
.detail-right-booking .daterangepicker select.yearselect {
    border: 1px solid #dadce0;
    border-radius: 4px;
}

.detail-right-booking .daterangepicker .input-mini {
    border: 1px solid #dadce0;
    border-radius: 4px;
}

.detail-right-booking .daterangepicker .ranges li {
    border-radius: 4px;
}

.detail-right-booking .daterangepicker .ranges li.active {
    background-color: #176DF2;
}

.detail-right-booking .daterangepicker .calendar th, 
.detail-right-booking .daterangepicker .calendar td {
    border-radius: 50%;
}


/*.booking-container {
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    width: 100%;
}*/

/*.booking-header {
    background-color: #2c3e50;
    color: white;
    padding: 20px;
    text-align: center;
}

.booking-header h2 {
    font-size: 24px;
    font-weight: 600;
}*/

/*.booking-form {
    padding: 25px;
}*/

.form-section {
    margin-bottom: 25px;
}

.section-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 2px;
    color: #333;
}

.guests-rooms {
    position: relative;
}

.guests-rooms-display {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: white;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.guests-rooms-display:hover {
    border-color: #176DF2;
}

.guests-rooms-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    z-index: 10;
    display: none;
    padding: 15px;
}

.guests-rooms-dropdown.active {
    display: block;
}

.guest-type {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.guest-type:last-child {
    margin-bottom: 0;
}

.guest-label {
    font-size: 14px;
    color: #333;
}

.guest-counter {
    display: flex;
    align-items: center;
}

.counter-btn {
    width: 30px;
    height: 30px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s;
}

.counter-btn:hover {
    background-color: #e9e9e9;
}

.counter-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.counter-value {
    margin: 0 15px;
    font-size: 14px;
    min-width: 20px;
    text-align: center;
}

.check-availability {
    width: 100%;
    padding: 15px;
    background-color: #176DF2;
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s;
}

.check-availability:hover {
    background-color: #2980b9;
}



.locaton-section .row{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 30px;
    margin-left: 0px;
    margin-right: 0px;
}

.location-box{
    margin-bottom: 30px;
}

.location-box h4{
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 10px;
}

.location-box p{
    margin-bottom: 40px;
}

.include-box{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 10px;
    background-color: #fbf9fa;
}

.include-box h5{
    font-size: 20px;
    line-height: 26px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 10px;
}

.include-box p{
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 0px;
}

.include-box p i{
    font-size: 6px;
    padding-right: 5px;
    position: relative;
    top: -3px;
}

.alsolike-section .row{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 30px;
    margin-left: 0px;
    margin-right: 0px;
}

.alsolike-section h4{
    font-size: 20px;
    line-height: 26px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 50px;
}

.alsolike-section h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 0px;
}

.alsolike-section p {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #4a5565;
    margin-bottom: 0px;
}




.serenity-section .row{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 40px;
    border-radius: 30px;
    margin-bottom: 30px;
    margin-left: 0px;
    margin-right: 0px;
}

.serenity-section h4 {
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #101828;
    text-align: center;
    margin-bottom: 10px;
}

.serenity-section p.serenity-text{
    text-align: center;
    font-size: 14px;
    line-height: 20px;
}

a.btn.btn-reserve {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 10px 30px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    color: #fff;
    border-radius: 30px;
    max-width: 160px;
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-bottom: 30px;
}

a.btn.btn-reserve:hover{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}

.paybox{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 20px;
    text-align: center;
    min-height: 138px;
    margin-bottom: 30px;
}

.paybox i{
    color: #176DF2;
    font-size: 18px;
    margin-bottom: 10px;
}

.paybox h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #101828;
    text-align: center;
    margin-bottom: 5px;
}

.paybox p{
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 0px;
}

.inport-box h6{
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #101828;
    margin-bottom: 10px;
}

.inport-box p{
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 10px;
}

/**************ABOUT US PAGE START HERE************/

.page-banner{
    padding: 50px 0;
}

.page-banner .page-content{
    background: url("../images/page-banner.jpg") center center no-repeat;
    background-color: cover;
    width: 100%;
    border-radius: 30px;
}

.page-banner .page-content .overlay{
    background-color: rgb(0 0 0 / 56%);
    padding: 120px 0;
    text-align: center;
    border-radius: 30px;
}

.page-banner .page-content h1{
    font-size: 50px;
    line-height: 60px;
    font-weight: 900;
    color: #fff;
    margin-bottom: 0px;
}

.about-body{
    padding-bottom: 50px;
}

.about-content{
    text-align: center;
}

.about-content h2{
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 5px;
}

.about-content h6{
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #176DF2;
    margin-bottom: 20px;
}

.about-body .about-content p{
    font-size: 18px;
    line-height: 32px;
    margin-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
}

img.about-imgs{
    width: 100%;
    height: 500px;
    object-fit: cover;
    margin-bottom: 50px;
}

.about-body h3{
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 25px;
}

.about-body p{
    font-size: 18px;
    line-height: 32px;
    margin-bottom: 10px;
}

.about-body h6{
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    color: #176DF2;
    margin-bottom: 20px;
}

.owner-column{
    text-align: center;
}

.owner-column h2{
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 25px;
}

.owner-column p{
    padding-left: 70px;
    padding-right: 70px;
}

/**************CONTACT US PAGE START HERE**************/

.contact-infos{
    padding-bottom: 50px;
}

.contact-infos h3,
.contact-infos h2 {
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

.contact-infos input{
    border: 1px solid #ddd;
    background-color: #f6f6fa;
    padding: 10px;
    font-size: 14px;
    color: #000;
    padding: 10px;
    height: 44px;
    margin-bottom: 20px;
}

.contact-infos textarea{
    border: 1px solid #ddd;
    background-color: #f6f6fa;
    padding: 10px;
    font-size: 14px;
    color: #000;
    padding: 10px;
    height: 140px;
    margin-bottom: 20px;
}

.contact-infos button.btn.btn-primary {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #fff;
}

.contact-infos button.btn.btn-primary:hover {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}

.contact-infos ul.address-info{
    padding: 0px;
    margin: 0px;
}

.contact-infos ul.address-info li{
    list-style-type: none;
    padding-bottom: 30px;
}

.contact-infos ul.address-info li i{
    background-color: #dfecff;
    padding: 14px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    color: #176DF2;
    text-align: center;
    line-height: 24px;
    float: left;
    margin-right: 20px;
}

.contact-infos ul.address-info li h5{
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 0px;
}

.contact-infos ul.address-info li p{
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 0px;
}

ul.address-socials{
    padding: 0px;
    margin: 0px;
}

ul.address-socials li{
    list-style-type: none;
    display: inline-block;
}

ul.address-socials li a i{
    background-color: #dfecff;
    padding: 14px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    color: #176DF2;
    text-align: center;
    line-height: 24px;
}

ul.address-socials li a i:hover{
    background-color: #176DF2;
    color: #fff;
}

/*************BOOKING PAGE START HERE************/




.booking-sections{
    padding-top: 30px;
}


.booking-sections .progress-bar {
    background-color: white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 0;
    z-index: 40;
}

.booking-sections .progress-steps {
    display: flex;
    justify-content: space-between;
    max-width: 100%;
    margin: 0 auto;
    padding: 1rem;
    width: 100%;
}

.booking-sections .progress-step {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.booking-sections .progress-step::after {
    content: '';
    position: absolute;
    top: 1.25rem;
    left: 50%;
    width: 100%;
    height: 2px;
    background-color: #e5e7eb;
    z-index: -1;
}

.booking-sections .progress-step:last-child::after {
    display: none;
}

.booking-sections .progress-step.active::after {
    background-color: #3b82f6;
}

.booking-sections .progress-step.completed::after {
    background-color: #3b82f6;
}

.booking-sections .step-circle {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.booking-sections .step-circle.active {
    background-color: #3b82f6;
    color: white;
}

.booking-sections .step-circle.completed {
    background-color: #10b981;
    color: white;
}

.booking-sections .step-circle.default {
    background-color: #d1d5db;
    color: white;
}

.booking-sections .step-label {
    font-size: 0.875rem;
    font-weight: 500;
}

.booking-sections .step-label.active {
    color: #1f2937;
}

.booking-sections .step-label.default {
    color: #6b7280;
}

/* Step Content Styles */
.booking-sections .step-content {
    display: none;
}

.booking-sections .step-content.active {
    display: block;
    animation: fadeIn 0.5s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Card Styles */
.booking-sections .card {
    background-color: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.booking-sections .card-header {
    margin-bottom: 1.5rem;
}

.booking-sections .card-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2937;
}

/* Hotel Info Styles */
.booking-sections .hotel-info {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}



.booking-sections .hotel-image {
    width: 100%;
    height: 12rem;
    object-fit: cover;
    border-radius: 0.5rem;
}



.booking-sections .hotel-details h1 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.5rem;
}

.booking-sections .hotel-location {
    display: flex;
    align-items: center;
    color: #4b5563;
    margin-bottom: 1rem;
}

.booking-sections .hotel-location i {
    margin-right: 0.5rem;
}

.booking-sections .hotel-rating {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.booking-sections .rating-badge {
    display: flex;
    align-items: center;
    background-color: #fef3c7;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    margin-right: 0.75rem;
}

.booking-sections .rating-badge i {
    color: #f59e0b;
    margin-right: 0.25rem;
}

.booking-sections .hotel-amenities {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.booking-sections .amenity-tag {
    display: flex;
    align-items: center;
    background-color: #dbeafe;
    color: #1d4ed8;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
}

.booking-sections .amenity-tag i {
    margin-right: 0.25rem;
}

/* Grid Layout */
.booking-sections .booking-grid {
    display: grid;
    gap: 2rem;
}



/* Form Styles */
.booking-sections .form-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}



.booking-sections .form-group {
    display: flex;
    flex-direction: column;
}

.booking-sections .form-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.25rem;
}

.booking-sections .form-input, .booking-sections .form-select {
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    transition: border-color 0.15s ease-in-out;
    width: 100%;
}

.booking-sections .form-input:focus, .booking-sections .form-select:focus {
    outline: none;
    border-color: #3b82f6;
}

/* Room Card Styles - Modified for Multiple Selection */
.booking-sections .room-card {
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1rem;
    transition: all 0.3s ease;
}

.booking-sections .room-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.booking-sections .room-card.selected {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

.booking-sections .room-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}



.booking-sections .room-image {
    width: 100%;
    height: 8rem;
    object-fit: cover;
    border-radius: 0.375rem;
}



.booking-sections .room-details {
    flex: 1;
}

.booking-sections .room-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
}

.booking-sections .room-name {
    font-size: 1.125rem;
    font-weight: 600;
}

.booking-sections .room-name a{
    text-decoration: none;
    color: #1f2937;
}

.booking-sections .room-name a:hover{
    color: #176DF2;
}

.booking-sections .room-price {
    text-align: right;
}

.booking-sections .room-price .amount {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
}

.booking-sections .room-price .period {
    font-size: 0.875rem;
    color: #6b7280;
}

.booking-sections .room-description {
    font-size: 0.875rem;
    color: #4b5563;
    margin-bottom: 0.75rem;
}

.booking-sections .room-features {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.booking-sections .feature-tag {
    display: flex;
    align-items: center;
    background-color: #f3f4f6;
    color: #4b5563;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
}

.booking-sections .feature-tag i {
    margin-right: 0.25rem;
}

.booking-sections .room-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.booking-sections .room-selection {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.booking-sections .room-checkbox {
    width: 1.25rem;
    height: 1.25rem;
    accent-color: #3b82f6;
    cursor: pointer;
}

.booking-sections .quantity-selector {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.booking-sections .quantity-label {
    font-size: 0.875rem;
    color: #4b5563;
}

.booking-sections .quantity-input {
    width: 4rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    text-align: center;
}

.booking-sections .cancellation-badge {
    display: flex;
    align-items: center;
    color: #10b981;
    font-size: 0.875rem;
}

.booking-sections .cancellation-badge i {
    margin-right: 0.25rem;
}

/* Add-ons Styles */
.booking-sections .addons-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}

@media (min-width: 768px) {
    .booking-sections .addons-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.booking-sections .addon-item {
    display: flex;
    align-items: center;
    padding: 1rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}

.booking-sections .addon-item:hover {
    background-color: #f9fafb;
}

.booking-sections .addon-checkbox {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    accent-color: #3b82f6;
}

.booking-sections .addon-details {
    flex: 1;
}

.booking-sections .addon-name {
    font-weight: 500;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.booking-sections .addon-description {
    font-size: 0.875rem;
    color: #6b7280;
}

.booking-sections .addon-price {
    font-weight: 600;
    color: #1f2937;
}

/* Booking Summary Styles */
.booking-sections .booking-summary {
    position: sticky;
    top: 6rem;
}

.booking-sections .summary-section {
    margin-bottom: 1.5rem;
}

.booking-sections .summary-title {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.75rem;
}

.booking-sections .summary-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.booking-sections .summary-label {
    color: #4b5563;
}

.booking-sections .summary-value {
    font-weight: 500;
}

.booking-sections .room-summary {
    background-color: #f9fafb;
    border-radius: 0.375rem;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
}

.booking-sections .room-summary-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}

.booking-sections .room-summary-name {
    font-weight: 500;
    color: #1f2937;
}

.booking-sections .room-summary-quantity {
    font-size: 0.75rem;
    color: #6b7280;
}

.booking-sections .room-summary-price {
    font-weight: 600;
    color: #1f2937;
}

.booking-sections .summary-divider {
    border-top: 1px solid #e5e7eb;
    margin: 1rem 0;
}

.booking-sections .summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.booking-sections .total-label {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1f2937;
}

.booking-sections .total-amount {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2563eb;
}

/* Button Styles */
.booking-sections .btn {
    padding: 0.75rem 1.5rem;
    border-radius: 0.375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.booking-sections .btn-primary {
    background-color: #3b82f6;
    color: white;
}

.booking-sections .btn-primary:hover {
    background-color: #2563eb;
}

.booking-sections .btn-primary:disabled {
    background-color: #9ca3af;
    cursor: not-allowed;
}

.booking-sections .btn-secondary {
    background-color: #e5e7eb;
    color: #374151;
}

.booking-sections .btn-secondary:hover {
    background-color: #d1d5db;
}

.booking-sections .btn-success {
    background-color: #10b981;
    color: white;
}

.booking-sections .btn-success:hover {
    background-color: #059669;
}

.booking-sections .btn-block {
    width: 100%;
}

.booking-sections .btn-group {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

/* Guest Details Styles */
.booking-sections .guest-section {
    margin-bottom: 1.5rem;
}

.booking-sections .section-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 1rem;
}

.booking-sections .guest-form-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
}



.booking-sections .add-guest-btn {
    color: #176DF2;
    font-size: 0.875rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    margin-top: 1rem;
    border: 1px solid #176DF2;
    padding: 5px 10px;
    border-radius: 5px;
}

.booking-sections .add-guest-btn:hover {
    color: #176DF2;
}

.booking-sections .add-guest-btn i {
    margin-right: 0.25rem;
}

/* Payment Styles */
.booking-sections .payment-methods {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}



.booking-sections .payment-method {
    border: 2px solid #e5e7eb;
    border-radius: 0.375rem;
    padding: 1rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.booking-sections .payment-method:hover {
    border-color: #3b82f6;
}

.booking-sections .payment-method.selected {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

.booking-sections .payment-method i {
    font-size: 3rem;
    color: #4b5563;
    margin-bottom: 0.5rem;
}

.booking-sections .payment-method p {
    font-weight: 500;
    color: #1f2937;
}

.booking-sections .card-form {
    display: none;
}

.booking-sections .card-form.active {
    display: block;
}

.booking-sections .card-form-grid {
    display: grid;
    gap: 1rem;
}

.booking-sections .card-form-grid .form-group:nth-child(3) {
    grid-column: span 1;
}

.booking-sections .card-form-grid .form-group:nth-child(4) {
    grid-column: span 1;
}



.booking-sections .input-group {
    position: relative;
}

.booking-sections .input-icons {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    gap: 0.5rem;
}

.booking-sections .input-icons i {
    color: #9ca3af;
}

/* Security Note */
.booking-sections .security-note {
    background-color: #d1fae5;
    border: 1px solid #6ee7b7;
    border-radius: 0.375rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.booking-sections .security-content {
    display: flex;
    align-items: flex-start;
}

.booking-sections .security-content i {
    color: #10b981;
    margin-right: 0.75rem;
    margin-top: 0.125rem;
}

.booking-sections .security-text h4 {
    font-weight: 500;
    color: #065f46;
    margin-bottom: 0.25rem;
}

.booking-sections .security-text p {
    font-size: 0.875rem;
    color: #047857;
}

/* Confirmation Styles */
.booking-sections .success-message {
    text-align: center;
    padding: 2rem;
}

.booking-sections .checkmark {
    width: 5rem;
    height: 5rem;
    background-color: #d1fae5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    animation: checkmark 0.5s ease-out;
}

@keyframes checkmark {
    0% { transform: scale(0); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

.booking-sections .checkmark i {
    font-size: 3rem;
    color: #10b981;
}

.booking-sections .success-title {
    font-size: 2rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.5rem;
}

.booking-sections .success-subtitle {
    color: #6b7280;
    margin-bottom: 1.5rem;
}

.booking-sections .booking-ref {
    display: inline-block;
    background-color: #dbeafe;
    border: 1px solid #93c5fd;
    border-radius: 0.375rem;
    padding: 1rem;
}

.booking-sections .booking-ref-label {
    font-size: 0.875rem;
    color: #1e40af;
}

.booking-sections .booking-ref-number {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2563eb;
}

.booking-sections .confirmation-grid {
    display: grid;
    gap: 2rem;
    margin-bottom: 2rem;
}



.booking-sections .confirmation-card {
    background-color: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

.booking-sections .hotel-card-content {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.booking-sections .hotel-thumb {
    width: 8rem;
    height: 6rem;
    object-fit: cover;
    border-radius: 0.375rem;
}

.booking-sections .hotel-info-details h3 {
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.booking-sections .hotel-info-details p {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

.booking-sections .hotel-contact {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #6b7280;
}

.booking-sections .hotel-contact i {
    margin-right: 0.5rem;
    color: #9ca3af;
}

.booking-sections .info-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.booking-sections .info-item {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
}

.booking-sections .info-label {
    color: #4b5563;
}

.booking-sections .info-value {
    font-weight: 500;
}

.booking-sections .room-list {
    margin-bottom: 1rem;
}

.booking-sections .room-list-item {
    background-color: #f9fafb;
    border-radius: 0.375rem;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
}

.booking-sections .room-list-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}

.booking-sections .room-list-name {
    font-weight: 500;
    color: #1f2937;
}

.booking-sections .room-list-details {
    font-size: 0.75rem;
    color: #6b7280;
}

.booking-sections .room-list-price {
    font-weight: 600;
    color: #1f2937;
}

.booking-sections .next-steps {
    background-color: #dbeafe;
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.booking-sections .steps-grid {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}



.booking-sections .step-item {
    text-align: center;
}

.booking-sections .step-icon {
    width: 3rem;
    height: 3rem;
    background-color: #3b82f6;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.5rem;
}

.booking-sections .step-item h3 {
    font-weight: 500;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.booking-sections .step-item p {
    font-size: 0.875rem;
    color: #6b7280;
}

.booking-sections .action-buttons {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
}



/* Utility Classes */
.booking-sections .text-center {
    text-align: center;
}

.booking-sections .mb-2 {
    margin-bottom: 0.5rem;
}

.booking-sections .mb-4 {
    margin-bottom: 1rem;
}

.booking-sections .mb-6 {
    margin-bottom: 1.5rem;
}

.booking-sections .mb-8 {
    margin-bottom: 2rem;
}

.booking-sections .mt-3 {
    margin-top: 0.75rem;
}

.booking-sections .text-sm {
    font-size: 0.875rem;
}

.booking-sections .text-xs {
    font-size: 0.75rem;
}

.booking-sections .text-gray-500 {
    color: #6b7280;
}

.booking-sections .text-gray-600 {
    color: #4b5563;
}

.booking-sections .font-medium {
    font-weight: 500;
}

.booking-sections .font-semibold {
    font-weight: 600;
}

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

.booking-sections .flex {
    display: flex;
}

.booking-sections .items-center {
    align-items: center;
}

.booking-sections .justify-between {
    justify-content: space-between;
}

.booking-sections .gap-2 {
    gap: 0.5rem;
}

.booking-sections .gap-4 {
    gap: 1rem;
}

.booking-sections .rounded-lg {
    border-radius: 0.5rem;
}

.booking-sections .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.booking-sections .sticky {
    position: sticky;
}

.booking-sections .top-24 {
    top: 6rem;
}












/**********FAQS PAGE START HERE***********/



.faqs-sections img{
    width: 100%;
    height: 500px;
    object-fit: cover;
}

.faqs-sections .accordion-container{
  position: relative;
  max-width: 100%;
  width: 100%;
  /*float: left;*/

}
.faqs-sections .accordion-container > h2{
  text-align: center;
  color: #fff;
  padding-bottom: 5px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #fff;
}
.faqs-sections .set{
  position: relative;
  width: 100%;
  height: auto;
  background-color: #d1e3ff;
  box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -webkit-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -moz-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
  -ms-box-shadow: 0 5px 1px -3px rgba(0,0,0,.15);
    margin-bottom: 15px;
    border-radius: 10px;
}
.faqs-sections .set > a{
      display: block;
    font-size: 16px;
    padding: 20px 20px;
    text-decoration: none;
    color: #282828;
    font-weight: 600;
    border: 1px solid #DDDDDD;
    -webkit-transition: all 0.2s 
linear;
    -moz-transition: all 0.2s linear;
    transition: all 0.2s 
linear;
    border-radius: 5px;
    background-color: #fff;
}
.faqs-sections .set > a i{
  float: right;
  margin-top: 2px;
}
.faqs-sections .set > a.active{
  background-color: #fff;
  color: #000;
}
.faqs-sections .set .content{
  background-color: #fff;
      border-radius: 0 0 10px 10px;
  display:none;
}
.faqs-sections .set .content p{
  padding: 10px 15px;
  margin: 0;
  color: #333;
}

/****************BLOG PAGE START HERE**************/







.blogs-sections .blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 3rem 0;
}

/* Blog Card */
.blogs-sections .blog-card {
    background-color: #fff;
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    margin-bottom: 30px;
}

.blogs-sections .blog-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}

.blogs-sections .card-image-container {
    position: relative;
    height: 12rem;
    overflow: hidden;
}

.blogs-sections .card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.blogs-sections .blog-card:hover .card-image {
    transform: scale(1.05);
}

.blogs-sections .category-badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #fff;
    backdrop-filter: blur(10px);
}

.blogs-sections .category-reviews {
    background-color: #8b5cf6;
}

.blogs-sections .category-destinations {
    background-color: #176DF2;
}

.blogs-sections .category-tips {
    background-color: #176DF2;
}

.blogs-sections .category-experiences {
    background-color: #f97316;
}

.blogs-sections .featured-badge {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background-color: #facc15;
    color: #1f2937;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 700;
}

.blogs-sections .card-content {
    padding: 1.5rem;
}

.blogs-sections .card-meta {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.75rem;
}

.blogs-sections .card-meta span {
    display: flex;
    align-items: center;
}

.blogs-sections .card-meta i {
    margin-right: 0.25rem;
}

.blogs-sections .card-meta .separator {
    margin: 0 0.5rem;
}

.blogs-sections .card-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    cursor: pointer;
    transition: color 0.3s;
}

.blogs-sections .card-title a{
    text-decoration: none;
    color: #1f2937;
}

.blogs-sections .card-title a:hover {
    color: #176DF2;
}

.blogs-sections .card-excerpt {
    color: #4b5563;
    margin-bottom: 1rem;
}

.blogs-sections .card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.blogs-sections .author-info {
    display: flex;
    align-items: center;
}

.blogs-sections .author-info a{
    display: flex;
    text-decoration: none;
}

.blogs-sections .author-avatar {
    width: 2rem;
    height: 2rem;
    background-color: #d1d5db;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.blogs-sections .author-name {
    font-size: 0.875rem;
    line-height: 34px;
    color: #6b7280;
}

.blogs-sections .read-more {
    display: flex;
    align-items: center;
    color: #176DF2;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    transition: color 0.3s;
}

.blogs-sections .read-more:hover {
    color: #176DF2;
}

.blogs-sections .read-more i {
    margin-left: 0.25rem;
    transition: transform 0.3s;
}

.blogs-sections .read-more:hover i {
    transform: translateX(0.25rem);
}





/***************PARNER PAGE START HERE**************/

.partner-section{
    padding: 50px 0;
    text-align: center;
}

.partner-section h6{
    background-color: #dbeafe;
    padding: 6px 10px;
    border-radius: 30px;
    font-size: 11px;
    line-height: 16px;
    font-weight: 600;
    color: #1447e6;
    max-width: 210px;
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-bottom: 15px;
}

.partner-section h1{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 20px;
}

p.partner-content{
    font-size: 14px;
    line-height: 20px;
    padding-left: 190px;
    padding-right: 190px;
    margin-bottom: 40px;
}

a.btn.btn-start {
    border: 1px solid #1447e6;
    background-color: #1447e6;
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
    color: #fff;
    padding: 8px 20px;
    border-radius: 5px;
}

a.btn.btn-start:hover{
    border: 1px solid #1447e6;
    background-color: #1447e6;
    color: #fff;
}

a.btn.btn-start i.fa-trophy{
    padding-right: 5px;
}

a.btn.btn-start i.fa-arrow-right{
    padding-left: 5px;
}

a.btn.btn-demo {
    border: 1px solid #1447e6;
    background-color: transparent;
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
    color: #1447e6;
    padding: 8px 20px;
    border-radius: 5px;
}

a.btn.btn-demo:hover{
    border: 1px solid #1447e6;
    background-color: #1447e6;
    color: #fff;
}

a.btn.btn-demo i.fa-phone-volume{
    padding-right: 5px;
}

.demo-popup h5.modal-title{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #171717;
    margin-bottom: 0px;
}

.demo-popup h5.modal-title i{
    color: #1447e6;
    padding-right: 10px;
}

.demo-popup form label{
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 0px;
}

.demo-popup form input{
    font-size: 12px;
    color: #000;
    padding: 6px;
    border: 1x solid #ccc;
    border-radius: 5px;
    margin-bottom: 10px;
}

.demo-popup form textarea{
    font-size: 12px;
    color: #000;
    padding: 6px;
    border: 1x solid #ccc;
    border-radius: 5px;
    margin-bottom: 10px;
    height: 80px;
}

.demo-popup form button.btn.btn-primary {
    border: 1px solid #1447e6;
    background-color: #1447e6;
    float: right;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    color: #fff;
}





.setup-box{
    text-align: left;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #eee;
    margin-top: 40px;
}

.setup-box i{
    background-color: #dbeafe;
    color: #1447e6;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
    width: 32px;
    height: 32px;
    font-size: 14px;
    line-height: 32px;
    text-align: center;
}

.setup-box h5{
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 0px;
    font-weight: 600;
    color: #171717;
}

.setup-box p{
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 0px;
}

.impact-section{
    padding-bottom: 50px;
}

.impact-section h2{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: #171717;
    text-align: center;
    margin-bottom: 20px;
}

p.impact-content{
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    margin-bottom: 40px;
}

.impact-box{
    text-align: center;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #eee;
}

.impact-box i{
    background-color: #dbeafe;
    color: #1447e6;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    font-size: 18px;
    line-height: 45px;
    text-align: center;
    margin-bottom: 20px;
}

.impact-box h4{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: #171717;
    text-align: center;
    margin-bottom: 10px;
}

.impact-box h5{
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #171717;
    text-align: center;
    margin-bottom: 5px;
}

.impact-box p{
    color: #6a7282;
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 0px;
}


.whyus-section h6{
    background-color: #dbeafe;
    padding: 6px 10px;
    border-radius: 30px;
    font-size: 11px;
    line-height: 16px;
    font-weight: 600;
    color: #1447e6;
    max-width: 150px;
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-bottom: 15px;
}

.whyus-section h4{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: #171717;
    text-align: center;
    margin-bottom: 10px;
}

p.whyus-content {
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    margin-bottom: 40px;
}

.whyus-boxs{
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #eee;
    margin-bottom: 30px;
}

.whyus-boxs i.fa-heart,
.whyus-boxs i.fa-clock,
.whyus-boxs i.fa-chart-column,
.whyus-boxs i.fa-shield-halved,
.whyus-boxs i.fa-chart-line {
    background-color: #dbeafe;
    color: #1447e6;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    font-size: 18px;
    line-height: 45px;
    text-align: center;
    margin-bottom: 20px;
}

.whyus-boxs h5 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #171717;
    margin-bottom: 10px;
}

.whyus-boxs p{
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 10px;
}

.whyus-boxs ul{
    padding: 0px;
    margin: 0px;
}

.whyus-boxs ul li{
    list-style-type: none;
    padding-bottom: 5px;
    font-size: 14px;
    line-height: 20px;
    color: #4a5565;
}

.whyus-boxs ul li i{
    padding-right: 5px;
    color: #1447e6;
}

.paths-section{
    padding: 50px 0;
    text-align: center;
}

.paths-section h4{
    font-size: 24px;
    line-height: 30px;
    font-weight: 700;
    color: #171717;
    text-align: center;
    margin-bottom: 10px;
}

p.whyus-content {
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    margin-bottom: 40px;
}

.path-icon {
    background-color: #dbeafe;
    color: #1447e6;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    display: block;
    padding: 10px;
    margin: 0 auto;
    display: block;
    margin-bottom: 20px;
}

.path-icon i{
    display: block;
    font-size: 16px;
}

.paths-section h5{
    font-size: 16px;
    line-height: 20px;
    font-weight: 600;
    color: #171717;
    margin-bottom: 10px;
}

.paths-section p{
    font-size: 14px;
    line-height: 20px;
}

.paths-section ul{
    padding: 0px;
    margin: 0px;
}

.paths-section ul li{
    list-style-type: none;
    padding-bottom: 5px;
    font-size: 14px;
    line-height: 20px;
    color: #4a5565;
}

.paths-section ul li i{
    padding-right: 5px;
    color: #1447e6;
}

/************CANCELLATION POLICY PAGE START HERE***********/

.cancellation-section h1{
    font-size: 34px;
    line-height: 40px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 10px;
}

.cancellation-section h2{
    font-size: 26px;
    line-height: 20px;
    font-weight: 700;
    color: #171717;
    margin-bottom: 10px;
}

.cancellation-section ul{
    padding: 0px;
    margin: 0px;
    margin-bottom: 20px;
}

.cancellation-section ul li{
    list-style-type: none;
    padding-bottom: 10px;
    font-size: 14px;
    line-height: 20px;
    color: #4a5565;
}

.cancellation-section ul li i{
    padding-right: 0px;
    color: #176DF2;
}



/***************PARTNER SIGNUP PAGE START HERE*************/

.partner-signup-section{
    padding: 50px 0;
}


.partner-signup-section form{
    background-color: #f5f5f5;
    box-shadow: 0px 4px 10px rgba(0,0,0,0.05);
    padding: 40px;
    border-radius: 20px;
    max-width: 450px;
    width: 100%;
    margin: 0 auto;
    display: block;
    border: 1px solid #ddd;
}

.partner-signup-section form input{
    border: 1px solid #ccc;
    padding: 5px 10px;
    font-size: 12px;
    color: #000;
    margin-bottom: 10px;
}

.partner-signup-section form button.btn.btn-primary {
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 6px 20px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: #fff;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 10px;
}

.partner-signup-section form p{
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 0px;
    text-align: center;
}

.partner-signup-section form p a{
    color: #176DF2;
    text-decoration: none;
}

.partner-signup-section form p a:hover{
    text-decoration: underline;
}



/****************GUIDE LIST PAGE START HERE**************/

.guide-list-section{
    padding-top: 50px;
}


.guide-list-section .cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

.guide-list-section .guide-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    position: relative;
}

.guide-list-section .guide-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 50px rgba(0,0,0,0.2);
}

.guide-list-section .card-image {
    position: relative;
    height: 250px;
    overflow: hidden;
}

.guide-list-section .card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.guide-list-section .guide-card:hover .card-image img {
    transform: scale(1.1);
}

.guide-list-section .availability-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #4CAF50;
    color: white;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
}

.guide-list-section .availability-badge a{
    color: #fff;
    text-decoration: none;
}

.guide-list-section .availability-badge.busy {
    background: #ff6b6b;
}

.guide-list-section .card-content {
    padding: 20px;
}

.guide-list-section .guide-header {
    /*display: flex;*/
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
}

.guide-list-section .guide-name {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 0px;
}

.guide-list-section .guide-name a{
    color: #333;
    text-decoration: none;
}

.guide-list-section .guide-name a:hover{
    color: #176DF2;
}




.guide-list-section .guide-specialty {
    color: #176DF2;
    font-weight: 600;
    font-size: 0.9rem;
    float: left;
    display: inline-block;
}

.guide-list-section .rating {
    /*display: flex;*/
    align-items: center;
    gap: 5px;
    text-align: right;
}

.guide-list-section .stars a{
    color: #ffc107;
    font-size: 12px;
    text-decoration: none;
}

.guide-list-section .rating-text {
    color: #666;
    font-size: 12px;
}

.guide-list-section .guide-info {
    margin-bottom: 0px;
}

.guide-list-section .info-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0px;
    color: #666;
    font-size: 14px;
}

.guide-list-section .info-row i {
    width: 20px;
    color: #176DF2;
}

.guide-list-section .languages {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 5px 0;
    position: absolute;
    bottom: 0;
    left: 10px;
    z-index: 99;
}

.guide-list-section .language-tag {
    background: #f0f2ff;
    color: #176DF2;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

.guide-list-section .card-actions {
    display: flex;
    gap: 10px;
}

.guide-list-section .btn {
    flex: 1;
    padding: 12px;
    border: none;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.guide-list-section .btn-primary {
    background: #176DF2;
    color: white;
}

.guide-list-section .btn-primary:hover {
    background: #5a6fd8;
    transform: translateY(-2px);
}

.guide-list-section .btn-secondary {
    background: #f8f9fa;
    color: #176DF2;
    border: 2px solid #176DF2;
}

.guide-list-section .btn-secondary:hover {
    background: #176DF2;
    color: white;
}

.guide-list-section .price-info {
    background: #f8f9fa;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
}

.guide-list-section .price {
    font-size: 1.5rem;
    font-weight: 700;
    color: #333;
}

.guide-list-section .price-period {
    color: #666;
    font-size: 0.9rem;
}

.guide-list-section .featured-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: linear-gradient(45deg, #ff6b6b, #ffa500);
    color: white;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    z-index: 2;
}

.guide-list-section .featured-badge a{
    color: #fff;
    text-decoration: none;
}

/* Modal Styles */
#contactModal.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    backdrop-filter: blur(5px);
}

#contactModal .modal-content {
    background-color: white;
    margin: 5% auto;
    padding: 0;
    border-radius: 20px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.3);
    animation: modalSlideIn 0.3s ease;
}

@keyframes modalSlideIn {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

#contactModal .modal-header {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    padding: 20px 30px;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#contactModal .modal-header h2 {
    margin: 0;
    font-size: 1.5rem;
}

#contactModal .close {
    color: white;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

#contactModal .close:hover {
    opacity: 0.7;
}

#contactModal .modal-body {
    padding: 30px;
}

#contactModal .form-group {
    margin-bottom: 20px;
}

#contactModal .form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

#contactModal .form-group input,
#contactModal .form-group textarea {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
    font-family: inherit;
}

#contactModal .form-group input:focus,
#contactModal .form-group textarea:focus {
    outline: none;
    border-color: #176DF2;
}

#contactModal .form-group textarea {
    resize: vertical;
    min-height: 120px;
}

#contactModal .form-actions {
    display: flex;
    gap: 15px;
    margin-top: 30px;
}

#contactModal .btn-submit {
    flex: 1;
    background: #176DF2;
    color: white;
    padding: 15px;
    border: none;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
}

#contactModal .btn-submit:hover {
    background: #5a6fd8;
}

#contactModal .btn-cancel {
    flex: 1;
    background: #f8f9fa;
    color: #666;
    padding: 15px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

#contactModal .btn-cancel:hover {
    background: #e9ecef;
    border-color: #ccc;
}

#contactModal .success-message {
    display: none;
    background: #d4edda;
    color: #155724;
    padding: 15px;
    border-radius: 10px;
    margin-top: 20px;
    text-align: center;
    font-weight: 600;
}



















/***************GUIDE DETAILS PAGE START HERE***************/



.guide-hero {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    padding: 40px 0;
}

.guide-hero .hero-content {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 3rem;
    align-items: center;
}

.guide-hero .guide-photo {
    position: relative;
}

.guide-hero .guide-photo img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.guide-hero .availability-badge {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: #4CAF50;
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.guide-hero .hero-info h1 {
    font-size: 3rem;
    margin-bottom: 0.5rem;
}

.guide-hero .hero-specialty {
    font-size: 1.3rem;
    margin-bottom: 1.5rem;
    opacity: 0.9;
}

.guide-hero .hero-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin: 2rem 0;
}

.guide-hero .stat-item {
    text-align: center;
}

.guide-hero .stat-number {
    font-size: 2rem;
    font-weight: 700;
    display: block;
}

.guide-hero .stat-number i{
    color: #fdc700;
    margin-right: 2px;
    font-size: 20px;
}

.guide-hero .stat-label {
    font-size: 0.9rem;
    opacity: 0.8;
}

.guide-hero .hero-actions {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
}

.guide-hero .btn {
    padding: 12px 30px;
    border: none;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 1rem;
}

.guide-hero .btn-primary {
    background: white;
    color: #176DF2;
}

.guide-hero .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.guide-hero .btn-secondary {
    background: rgba(255,255,255,0.2);
    color: white;
    border: 2px solid white;
}

.guide-hero .btn-secondary:hover {
    background: white;
    color: #176DF2;
}

/* Main Content */
.guide-details-section .main-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 3rem 2rem;
}

/* Tabs */
.guide-details-section .tabs {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    border-bottom: 2px solid #e0e0e0;
    /*overflow-x: auto;*/
}

.guide-details-section .tab {
    padding: 1rem 2rem;
    background: none;
    border: none;
    font-size: 1rem;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    white-space: nowrap;
}

.guide-details-section .tab.active {
    color: #176DF2;
}

.guide-details-section .tab.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 3px;
    background: #176DF2;
}

.guide-details-section .tab:hover {
    color: #176DF2;
}

/* Tab Content */
.guide-details-section .tab-content {
    display: none;
    animation: fadeIn 0.5s ease;
}

.guide-details-section .tab-content.active {
    display: block;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* About Section */
.guide-details-section .about-section {
    background: white;
    padding: 2rem;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    margin-bottom: 2rem;
}

.guide-details-section .section-title {
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    color: #333;
}

.guide-details-section .about-text {
    font-size: 14px;
    line-height: 20px;
    color: #555;
    margin-bottom: 10px;
}

ul.guide-lists{
    padding: 0px;
    margin: 0px;
    margin-bottom: 10px;
}

ul.guide-lists li{
    list-style-type: none;
    display: inline-block;
    margin-right: 20px;
    font-size: 14px;
    line-height: 18px;
    color: #555;
}

ul.guide-lists li i{
    color: #176DF2;
    padding-right: 5px;
}

.availability-box{
    margin-top: 15px;
    margin-bottom: 15px;
}

.availability-box h3{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.availability-box h5{
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.availability-box p{
    color: #4a5565;
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 5px;
}

.availability-box p span{
    color: #176DF2;
    font-weight: 600;
    display: block;
}

a.btn.btn-books{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    padding: 6px 14px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: #fff;
}

a.btn.btn-books:hover{
    border: 1px solid #176DF2;
    background-color: #176DF2;
    color: #fff;
}


.guide-details-section .languages-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 0px;
}

.guide-details-section .language-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 10px;
}

.guide-details-section .language-item i {
    color: #176DF2;
    font-size: 1.2rem;
}

/* Experience Section */
.guide-details-section .timeline {
    position: relative;
    padding-left: 2rem;
}

.guide-details-section .timeline::before {
    content: '';
    position: absolute;
    left: 23px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #176DF2;
}

.guide-details-section .timeline-item {
    position: relative;
    margin-bottom: 2rem;
    padding-left: 2rem;
}

.guide-details-section .timeline-item::before {
    content: '';
    position: absolute;
    left: -1rem;
    top: 0.5rem;
    width: 1rem;
    height: 1rem;
    background: #176DF2;
    border-radius: 50%;
    border: 3px solid white;
    box-shadow: 0 0 0 3px #176DF2;
}

.guide-details-section .timeline-date {
    font-weight: 600;
    color: #176DF2;
    margin-bottom: 0.5rem;
}

.guide-details-section .timeline-title {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.guide-details-section .timeline-company {
    color: #666;
    margin-bottom: 0.5rem;
}

.guide-details-section .timeline-description {
    color: #555;
}

/* Services Section */
.guide-details-section .services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

.guide-details-section .service-card {
    background: white;
    padding: 2rem;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
}

.guide-details-section .service-card:hover {
    transform: translateY(-5px);
}

.guide-details-section .service-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.guide-details-section .service-icon i {
    font-size: 1.5rem;
    color: white;
}

.guide-details-section .service-title {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.guide-details-section .service-description {
    color: #666;
    margin-bottom: 1.5rem;
}

.guide-details-section .service-price {
    font-size: 1.5rem;
    font-weight: 700;
    color: #176DF2;
}

/* Reviews Section */
.guide-details-section .reviews-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.guide-details-section .rating-summary {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.guide-details-section .rating-number {
    font-size: 3rem;
    font-weight: 700;
    color: #176DF2;
}

.guide-details-section .rating-details {
    display: flex;
    flex-direction: column;
}

.guide-details-section .stars {
    color: #ffc107;
    font-size: 1.2rem;
}

.guide-details-section .rating-count {
    color: #666;
}

.guide-details-section .review-item {
    background: white;
    padding: 2rem;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    margin-bottom: 1.5rem;
}

.guide-details-section .review-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.guide-details-section .reviewer-info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.guide-details-section .reviewer-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.guide-details-section .reviewer-name {
    font-weight: 600;
}

.guide-details-section .review-date {
    color: #666;
    font-size: 0.9rem;
}

.guide-details-section .review-text {
    color: #555;
    line-height: 1.6;
}

/* Contact Section */
.guide-details-section .contact-section {
    background: white;
    padding: 3rem;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    margin-top: 3rem;
}

.guide-details-section .contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
}

.guide-details-section .contact-info h3 {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    color: #333;
}

.guide-details-section .contact-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.guide-details-section .contact-item i {
    width: 40px;
    height: 40px;
    background: #f0f2ff;
    color: #176DF2;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.guide-details-section .contact-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.guide-details-section .form-group {
    display: flex;
    flex-direction: column;
}

.guide-details-section .form-group label {
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #333;
}

.guide-details-section .form-group input,
.guide-details-section .form-group textarea {
    padding: 12px 15px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.guide-details-section .form-group input:focus,
.guide-details-section .form-group textarea:focus {
    outline: none;
    border-color: #176DF2;
}

.guide-details-section .form-group textarea {
    resize: vertical;
    min-height: 120px;
}

/**************DEALS PAGE START HERE*************/



.searchs-sections {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    padding: 3rem 2rem;
    border-radius: 1rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    color: white;
    max-width: 1300px !important;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 50px;
}

.searchs-sections .search-container {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    background: rgba(255, 255, 255, 0.1);
    padding: 1.5rem;
    border-radius: 1rem;
    backdrop-filter: blur(10px);
}

.search-input-wrapper {
    flex: 1;
    min-width: 250px;
    position: relative;
}

.search-input {
    width: 100%;
    padding: 1rem 1rem 1rem 3rem;
    border: none;
    border-radius: 0.75rem;
    font-size: 1.1rem;
    background: rgba(255, 255, 255, 0.9);
    color: #1f2937;
    transition: all 0.3s ease;
}

.search-input:focus {
    outline: none;
    background: white;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);
}

.search-icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 1.2rem;
}

.search-button {
    background-color: #f59e0b;
    color: white;
    border: none;
    padding: 1rem 2rem;
    border-radius: 0.75rem;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.search-button:hover {
    background-color: #d97706;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
}

.filter-chips {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    justify-content: center;
}

.filter-chip {
    background: rgba(255, 255, 255, 0.2);
    padding: 0.75rem 1.25rem;
    border-radius: 2rem;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(10px);
}

.filter-chip:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
}

.filter-chip.active {
    background: white;
    color: #176DF2;
    border-color: white;
}

/* Main Content */

/* Deals Grid */
.deals-sections .deals-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.deals-sections .deal-card {
    background-color: #ffffff;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
}

.deals-sections .deal-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.deals-sections .deal-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    position: relative;
}

.deals-sections .deal-badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    background-color: #f59e0b;
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
}

.deals-sections .deal-favorite {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background-color: rgba(255, 255, 255, 0.9);
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    transition: all 0.3s ease;
    padding: 10px;
    text-align: center;
    line-height: 22px;
}

.deals-sections .deal-favorite:hover {
    background-color: white;
    transform: scale(1.1);
}

.deals-sections .deal-favorite.active {
    color: #ef4444;
}

.deals-sections .deal-content {
    padding: 1.5rem;
}

.deals-sections .deal-destination {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.deals-sections .deal-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.deals-sections .deal-title a{
    text-decoration: none;
    color: #1f2937;
}

.deals-sections .deal-description {
    color: #6b7280;
    font-size: 0.875rem;
    margin-bottom: 1rem;
    line-height: 1.5;
}

.deals-sections .deal-features {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.deals-sections .deal-feature {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875rem;
    color: #6b7280;
}

.deals-sections .deal-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.deals-sections .deal-price {
    display: flex;
    flex-direction: column;
}

.deals-sections .price-original {
    font-size: 0.875rem;
    color: #6b7280;
    text-decoration: line-through;
}

.deals-sections .price-current {
    font-size: 1.5rem;
    font-weight: 700;
    color: #176DF2;
}

.deals-sections .deal-book-button {
    background-color: #176DF2;
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

.deals-sections .deal-book-button:hover {
    background-color: #176DF2;
    transform: translateY(-1px);
}

/*************PACKAGE PAGE SATRT HERE************/        

.package-detail-secton{
    padding-top: 50px;
}


.package-detail-secton .destination-detail {
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    margin-bottom: 3rem;
}

.package-detail-secton .destination-hero {
    position: relative;
    height: 500px;
    overflow: hidden;
}

.package-detail-secton .destination-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.package-detail-secton .destination-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    padding: 3rem 3rem 10px;
    color: #ffffff;
}

.package-detail-secton .destination-title {
    font-size: 3rem;
    margin-bottom: 0.5rem;
}

.package-detail-secton .destination-subtitle {
    font-size: 1.3rem;
    opacity: 0.9;
    color: #fff;
    margin-bottom: 10px;
}

.package-detail-secton p{
    margin-bottom: 10px;
    color: #fff;
}

.package-detail-secton p i.fa-star{
    color: #ffd700;
    font-size: 12px;
    margin-right: 5px;
}

.package-detail-secton .destination-content {
    padding: 3rem;
}

.package-detail-secton .info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.package-detail-secton .info-card {
    text-align: center;
    padding: 1.5rem;
    background: #f3f4f6;
    border-radius: 15px;
    transition: transform 0.3s ease;
}

.package-detail-secton .info-card:hover {
    transform: translateY(-5px);
}

.package-detail-secton .info-icon {
    font-size: 2.5rem;
    color: #176DF2;
    margin-bottom: 1rem;
}

.package-detail-secton .info-label {
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.5rem;
}

.package-detail-secton .info-value {
    color: #6b7280;
}

.package-detail-secton .description-section {
    margin-bottom: 30px;
}

.package-detail-secton .section-heading {
    font-size: 24px;
    margin-bottom: 15px;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 1rem;
    line-height: 28px;
    font-weight: 700;
}

.package-detail-secton .section-heading i {
    color: #176DF2;
}

.package-detail-secton .description-text {
    color: #4b5563;
    font-size: 1.1rem;
    line-height: 1.8;
}

.package-detail-secton .highlights-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.package-detail-secton .highlight-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
    background: #f3f4f6;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.package-detail-secton .highlight-item:hover {
    background: #e5e7eb;
    transform: translateX(5px);
}

.package-detail-secton .highlight-icon {
    color: #176DF2;
    font-size: 1.5rem;
    margin-top: 0.2rem;
}

.package-detail-secton .highlight-content h4 {
    color: #1f2937;
    margin-bottom: 0.5rem;
    font-size: 20px;
    font-weight: 600;
}

.package-detail-secton .highlight-content p {
    color: #6b7280;
    font-size: 0.95rem;
    margin-bottom: 0px;
}

.package-detail-secton .itinerary {
    background: #f3f4f6;
    padding: 2rem;
    border-radius: 15px;
}

.package-detail-secton .day-item {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #d1d5db;
}

.package-detail-secton .day-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.package-detail-secton .day-number {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: #176DF2;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
}

.package-detail-secton .day-content{
    width: 100%;
}

.package-detail-secton .day-content h4 {
    color: #1f2937;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 20px;
}

.package-detail-secton .day-content img{
    width: 100px;
    height: 80px;
    float: left;
    margin-right: 15px;
    border-radius: 10px;
}

.package-detail-secton .day-content a.play-video {
    background-color: #000;
    padding: 20px;
    display: inline-block;
    float: left;
    border-radius: 10px;
    margin-right: 20px;
    font-size: 30px;
    color: #ff0000;
    width: 100px;
    text-align: center;
}

.video-popup button.btn-close {
    position: absolute;
    top: -5px;
    right: -5px;
    background-color: #ff0000;
    padding: 5px;
    font-size: 10px;
    z-index: 9999;
    opacity: 1;
    color: #fff !important;
}

.video-popup .modal-dialog{
    max-width: 900px;
}

.package-detail-secton .day-content video,
.package-detail-secton .day-content iframe{
    width: 100px !important;
    height: 80px !important;
    float: left;
    margin-right: 15px;
    border-radius: 10px;
}

.package-detail-secton .day-content p {
    color: #4b5563;
    margin-bottom: 0px;
}

/* Hotel Detail Section */
.package-detail-secton .hotel-detail {
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 3rem;
}

.package-detail-secton .hotel-header {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 2rem;
    padding: 3rem;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: #ffffff;
}

.package-detail-secton .hotel-info h2 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

.package-detail-secton .hotel-rating {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.package-detail-secton .hotel-info p{
    color: #fff;
}

.package-detail-secton .stars {
    color: #f59e0b;
    font-size: 1.2rem;
}

.package-detail-secton .hotel-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    height: 200px;
}

.package-detail-secton .gallery-item {
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.package-detail-secton .gallery-item:hover {
    transform: scale(1.05);
}

.package-detail-secton .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.package-detail-secton .hotel-content {
    padding: 3rem;
}

.package-detail-secton .amenities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    /*margin-bottom: 3rem;*/
}

.package-detail-secton .amenity-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: #f3f4f6;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.package-detail-secton .amenity-item:hover {
    background: #e5e7eb;
    transform: translateY(-3px);
}

.package-detail-secton .amenity-icon {
    color: #176DF2;
    font-size: 1.5rem;
}

/* Tour Guide Detail Section */
.package-detail-secton .guide-detail {
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
}

.package-detail-secton .guide-header {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    padding: 3rem;
    color: #ffffff;
    text-align: center;
}

.package-detail-secton .guide-avatar {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin: 0 auto 2rem;
    overflow: hidden;
    border: 5px solid #ffffff;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.package-detail-secton .guide-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.package-detail-secton .guide-name {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

.package-detail-secton .guide-specialty {
    font-size: 1.3rem;
    opacity: 0.9;
    margin-bottom: 2rem;
    color: #fff;
}

.package-detail-secton .guide-stats {
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
}

.package-detail-secton .stat-item {
    text-align: center;
    min-width: 120px;
}

.package-detail-secton .stat-number {
    font-size: 2rem;
    font-weight: bold;
    display: block;
}

.package-detail-secton .stat-label {
    font-size: 0.9rem;
    opacity: 0.8;
}

.package-detail-secton .guide-price {
    margin-top: 2rem;
    font-size: 1.5rem;
    font-weight: bold;
    color: #fff;
}

.package-detail-secton .guide-content {
    padding: 3rem;
}

.package-detail-secton .bio-section {
    margin-bottom: 3rem;
}

.package-detail-secton .bio-text {
    color: #4b5563;
    font-size: 1.1rem;
    line-height: 1.8;
}

/*.package-detail-secton .languages-section {
    margin-bottom: 3rem;
}*/

.package-detail-secton .language-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
}

.package-detail-secton .language-tag {
    background: #f3f4f6;
    padding: 0.8rem 1.5rem;
    border-radius: 25px;
    color: #1f2937;
    font-weight: 500;
    transition: all 0.3s ease;
}

.package-detail-secton .language-tag:hover {
    background: #176DF2;
    color: #ffffff;
    transform: translateY(-3px);
}

/* Book Package Button */
.package-detail-secton .book-package-section {
    text-align: center;
    margin: 0;
}

.package-detail-secton .book-package-btn {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    padding: 1.2rem 3rem;
    background: linear-gradient(135deg, #176DF2, #f59e0b);
    color: #ffffff;
    text-decoration: none;
    border-radius: 50px;
    font-size: 1.3rem;
    font-weight: 700;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.package-detail-secton .book-package-btn:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.package-detail-secton .book-package-btn i {
    font-size: 1.5rem;
}


.include-content{
    display: flex;
    margin-bottom: 30px;
    gap: 20px;
}

.include-content .include{
    width: 100%;
}

.include-content h4{
    font-size: 24px;
    margin-bottom: 15px;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 1rem;
    line-height: 28px;
    font-weight: 700;
}

.include-content h4 i {
    color: #176DF2;
}

.include-content ul{
    padding: 0px;
    margin: 0px;
    padding-left: 20px;
}

.include-content ul li{
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #4b5563;
    padding-bottom: 10px;
}


a.btn.btn-book-package {
    border: none;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    padding: 12px 20px;
    border-radius: 30px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #fff;
    position: fixed;
    z-index: 99;
    top: 15%;
    right: 3%;
}

a.btn.btn-book-package:hover {
    border: none;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: #fff;
}






/***********PAYMENT PAGE START HERE**********/


.payment-detail-section{
    padding-top: 30px;
}

.payment-detail-section .grid {
    display: grid;
    gap: 2rem;
}

@media (min-width: 1024px) {
    .payment-detail-section .grid {
        grid-template-columns: 2fr 1fr;
    }
}

.payment-detail-section .card {
    background-color: #ffffff;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
    animation: fadeIn 0.5s ease-in;
    margin-bottom: 30px;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.payment-detail-section .card-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #111827;
}

.payment-detail-section .form-group {
    margin-bottom: 1rem;
}

.payment-detail-section .form-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.5rem;
}

.payment-detail-section .form-input {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    transition: all 0.3s ease;
}

.payment-detail-section .form-input:focus {
    outline: none;
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(59, 130, 246, 0.15);
    border-color: #3b82f6;
    ring: 2px;
    ring-color: #3b82f6;
}

.payment-detail-section .form-grid {
    display: grid;
    gap: 1rem;
}

@media (min-width: 768px) {
    .payment-detail-section .form-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .payment-detail-section .form-grid .full-width {
        grid-column: 1 / -1;
    }
}

.payment-detail-section .payment-methods {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .payment-detail-section .payment-methods {
        grid-template-columns: repeat(3, 1fr);
    }
}

.payment-detail-section .payment-method-card {
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.payment-detail-section .payment-method-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.payment-detail-section .payment-method-card.selected {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

.payment-detail-section .payment-method-card i {
    font-size: 1.5rem;
    color: #3b82f6;
    margin-bottom: 0.5rem;
}

.payment-detail-section .payment-method-card p {
    font-size: 0.875rem;
    font-weight: 500;
    color: #111827;
}

.payment-detail-section .input-icon {
    position: relative;
}

.payment-detail-section .input-icon i {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
}

.payment-detail-section .input-icon input {
    padding-right: 3rem;
}

.payment-detail-section .checkbox-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.payment-detail-section .checkbox-label {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #374151;
    cursor: pointer;
}

.payment-detail-section .checkbox-label input {
    margin-right: 0.5rem;
    border-radius: 0.25rem;
    border-color: #d1d5db;
}

.payment-detail-section .checkbox-label input:focus {
    ring: 2px;
    ring-color: #3b82f6;
    border-color: #3b82f6;
}

.payment-detail-section .sticky {
    position: sticky;
    top: 2rem;
}

.payment-detail-section .room-details {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.payment-detail-section .room-image {
    width: 5rem;
    height: 5rem;
    border-radius: 0.5rem;
    object-fit: cover;
}

.payment-detail-section .room-info h4 {
    font-weight: 500;
    color: #111827;
    margin-bottom: 0.25rem;
}

.payment-detail-section .room-info p {
    font-size: 0.875rem;
    color: #4b5563;
    margin-bottom: 0.25rem;
}

.payment-detail-section .rating {
    display: flex;
    align-items: center;
    font-size: 0.75rem;
    color: #4b5563;
}

.payment-detail-section .rating i {
    color: #fbbf24;
    margin-right: 0.25rem;
}

.payment-detail-section .dates {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.payment-detail-section .dates-grid {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
}

.payment-detail-section .date-label {
    color: #4b5563;
}

.payment-detail-section .date-value {
    font-weight: 500;
    color: #111827;
}

.payment-detail-section .date-time {
    font-size: 0.75rem;
    color: #6b7280;
}

.payment-detail-section .nights {
    display: flex;
    align-items: center;
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: #4b5563;
}

.payment-detail-section .nights i {
    margin-right: 0.5rem;
}

.payment-detail-section .price-breakdown {
    margin-bottom: 1rem;
}

.payment-detail-section .price-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.payment-detail-section .price-label {
    color: #4b5563;
}

.payment-detail-section .price-value {
    color: #111827;
}

.payment-detail-section .price-total {
    padding-top: 0.5rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e5e7eb;
}

.payment-detail-section .price-total .price-row {
    font-size: 1rem;
}

.payment-detail-section .price-total .price-label,
.payment-detail-section .price-total .price-value {
    font-weight: 600;
}

.payment-detail-section .promo-code {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.payment-detail-section .promo-input {
    flex: 1;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.875rem;
}

.payment-detail-section .promo-input:focus {
    outline: none;
    border-color: #3b82f6;
    ring: 2px;
    ring-color: #3b82f6;
}

.payment-detail-section .promo-button {
    padding: 0.5rem 1rem;
    background-color: #f3f4f6;
    color: #374151;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.payment-detail-section .promo-button:hover {
    background-color: #e5e7eb;
}

.payment-detail-section .cancellation-policy {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
}

.payment-detail-section .cancellation-content {
    display: flex;
    align-items: flex-start;
}

.payment-detail-section .cancellation-content i {
    color: #16a34a;
    margin-top: 0.125rem;
    margin-right: 0.5rem;
}

.payment-detail-section .cancellation-text {
    font-size: 0.875rem;
}

.payment-detail-section .cancellation-title {
    font-weight: 500;
    color: #14532d;
    margin-bottom: 0.25rem;
}

.payment-detail-section .cancellation-desc {
    color: #15803d;
}

.payment-detail-section .book-button {
    width: 100%;
    padding: 0.75rem;
    background-color: #3b82f6;
    color: #ffffff;
    border: none;
    border-radius: 0.5rem;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s;
}

.payment-detail-section .book-button:hover {
    background-color: #2563eb;
}

.payment-detail-section .book-button i {
    margin-right: 0.5rem;
}

.payment-detail-section .security-badges {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1rem;
    font-size: 0.75rem;
    color: #6b7280;
}

.payment-detail-section .security-badge {
    display: flex;
    align-items: center;
}

.payment-detail-section .security-badge i {
    margin-right: 0.25rem;
}

.payment-detail-section .modal {
    display: none;
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    align-items: center;
    justify-content: center;
    z-index: 50;
}

.payment-detail-section .modal.show {
    display: flex;
}

.payment-detail-section .modal-content {
    background-color: #ffffff;
    border-radius: 0.5rem;
    padding: 2rem;
    max-width: 28rem;
    margin: 0 1rem;
    animation: fadeIn 0.5s ease-in;
}

.payment-detail-section .modal-icon {
    width: 4rem;
    height: 4rem;
    background-color: #dcfce7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}

.payment-detail-section .modal-icon i {
    font-size: 1.5rem;
    color: #16a34a;
}

.payment-detail-section .modal-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    text-align: center;
    margin-bottom: 0.5rem;
}

.payment-detail-section .modal-text {
    color: #4b5563;
    text-align: center;
    margin-bottom: 1.5rem;
}

.payment-detail-section .modal-button {
    display: block;
    width: 100%;
    padding: 0.5rem 1.5rem;
    background-color: #3b82f6;
    color: #ffffff;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.payment-detail-section .modal-button:hover {
    background-color: #2563eb;
}

.payment-detail-section .hidden {
    display: none;
}

.payment-detail-section .paypal-form {
    background-color: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
}

.payment-detail-section .paypal-form i {
    font-size: 2.5rem;
    color: #3b82f6;
    margin-bottom: 0.75rem;
}

.payment-detail-section .paypal-form p {
    color: #374151;
    margin-bottom: 1rem;
}

.payment-detail-section .paypal-button {
    padding: 0.5rem 1.5rem;
    background-color: #3b82f6;
    color: #ffffff;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.payment-detail-section .paypal-button:hover {
    background-color: #2563eb;
}

.payment-detail-section .apple-form {
    background-color: #111827;
    color: #ffffff;
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
}

.payment-detail-section .apple-form i {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}

.payment-detail-section .apple-form p {
    margin-bottom: 1rem;
}

.payment-detail-section .apple-button {
    padding: 0.5rem 1.5rem;
    background-color: #ffffff;
    color: #111827;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.payment-detail-section .apple-button:hover {
    background-color: #f3f4f6;
}































/*************CAREER DETAIL PAGE START HERE*************/





.job-header {
    background: white;
    padding: 15px 0;
    border-bottom: 1px solid #e5e7eb;
}

.job-header .job-header-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.job-header .job-title {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 10px;
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.job-header .job-meta {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.job-header .meta-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6b7280;
}

.job-header .meta-item i {
    color: #176DF2;
}

.job-header .job-tags {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.job-header .tag {
    font-size: 0.875rem;
    padding: 0.5rem 1rem;
    border-radius: 9999px;
    background: #f3f4f6;
    color: #4b5563;
    line-height: 12px;
}

.job-header .tag.highlight {
    background: #ede9fe;
    color: #176DF2;
}

/* Job Content */
.job-content {
    padding: 50px 0;
}

.job-content .content-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 3rem;
    max-width: 1200px;
    margin: 0 auto;
}

.job-content .main-content {
    background: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.job-content .sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.job-content .sidebar-card {
    background: white;
    padding: 1.5rem;
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.job-content .section-title {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #1f2937;
}

.job-content .section-content {
    color: #4b5563;
}

.job-content .section-content ul {
    list-style: none;
    padding-left: 0;
}

.job-content .section-content li {
    padding: 0.5rem 0;
    padding-left: 1.5rem;
    position: relative;
}

.job-content .section-content li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #176DF2;
    font-weight: bold;
}

.job-content .benefit-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 10px 0;
    border-bottom: 1px solid #f3f4f6;
}

.job-content .benefit-item:last-child {
    border-bottom: none;
}

.job-content .benefit-icon {
    width: 2.5rem;
    height: 2.5rem;
    background: #f3f4f6;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.job-content .benefit-icon i {
    color: #176DF2;
}

.job-content .benefit-text {
    font-size: 0.875rem;
}

.job-content .benefit-text h4 {
    font-weight: 600;
    margin-bottom: 0.25rem;
    font-size: 18px;
    line-height: 20px;
}

.job-content .benefit-text p {
    color: #6b7280;
    font-size: 0.8rem;
    line-height: 20px;
    margin-bottom: 0px;
}

.job-content .apply-card {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    text-align: center;
}

.job-content .apply-card h3 {
    font-size: 1.25rem;
    margin-bottom: 1rem;
}

.job-content .apply-card p {
    margin-bottom: 1.5rem;
    opacity: 0.9;
    color: #fff;
}

.job-content .btn-apply {
    background: white;
    color: #176DF2;
    padding: 0.75rem 2rem;
    border-radius: 9999px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: transform 0.3s;
}

.job-content .btn-apply:hover {
    transform: translateY(-2px);
}

/* Modal */
#applicationModal.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 1rem;
}

#applicationModal .modal-content {
    background: white;
    border-radius: 1rem;
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

#applicationModal .modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

#applicationModal .modal-header h3 {
    font-size: 1.25rem;
    font-weight: 700;
}

#applicationModal .modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
}

#applicationModal .modal-body {
    padding: 1.5rem;
}

#applicationModal .form-group {
    margin-bottom: 1rem;
}

#applicationModal .form-group label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #374151;
}

#applicationModal .form-control {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 1rem;
    transition: border-color 0.3s;
}

#applicationModal .form-control:focus {
    outline: none;
    border-color: #176DF2;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

#applicationModal .form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

#applicationModal .btn {
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
    border: none;
    font-size: 1rem;
}

#applicationModal .btn-submit {
    background: linear-gradient(135deg, #176DF2 0%, #764ba2 100%);
    color: white;
    flex: 1;
}

#applicationModal .btn-submit:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

#applicationModal .btn-cancel {
    background: white;
    color: #374151;
    border: 2px solid #d1d5db;
    flex: 1;
}

#applicationModal .btn-cancel:hover {
    border-color: #9ca3af;
}

/* Success Message */
#successMessage.success-message {
    position: fixed;
    top: 1rem;
    right: 1rem;
    background: #176DF2;
    color: white;
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    transform: translateX(400px);
    transition: transform 0.3s;
    z-index: 200;
    max-width: calc(100% - 2rem);
}

#successMessage.success-message.show {
    transform: translateX(0);
}


/**************BLOG DETAIL PAGE START HERE************/



.blog-details-sections .main-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 2rem 0;
}

@media (min-width: 1024px) {
    .blog-details-sections .main-container {
        flex-direction: row;
    }
}

/* Blog content styles */
.blog-details-sections .blog-article {
    flex: 1;
    background-color: #ffffff;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    padding: 2rem;
    animation: fadeIn 0.5s ease-in;
}

/* Blog header */
.blog-details-sections .blog-meta {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 1rem;
}

.blog-details-sections .blog-meta span {
    display: flex;
    align-items: center;
}

.blog-details-sections .blog-meta i {
    margin-right: 0.5rem;
}

.blog-details-sections .blog-title {
    font-size: 2.25rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1rem;
}

.blog-details-sections .blog-author {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.blog-details-sections .author-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.blog-details-sections .author-avatar {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    object-fit: cover;
}

.blog-details-sections .author-name {
    font-weight: 600;
    color: #111827;
    margin-bottom: 0px;
}

.blog-details-sections .author-title {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0px;
}

.blog-details-sections .social-links {
    display: flex;
    gap: 0.75rem;
}

.blog-details-sections .social-links button {
    color: #6b7280;
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.2s;
}

.blog-details-sections .social-links button:hover {
    color: #4f46e5;
}

.blog-details-sections .social-links i {
    font-size: 1.25rem;
}

/* Featured image */
.blog-details-sections .featured-image {
    margin-bottom: 2rem;
}

.blog-details-sections .featured-image img {
    width: 100%;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

/* Blog content */
.blog-details-sections .blog-content {
    color: #374151;
    line-height: 1.8;
}

.blog-details-sections .blog-content p {
    margin-bottom: 1.5rem;
}

.blog-details-sections .blog-content h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.blog-details-sections .blog-content h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

.blog-details-sections .blog-content ul {
    margin-bottom: 1.5rem;
    padding-left: 1.5rem;
    list-style-type: disc;
}

.blog-details-sections .blog-content li {
    margin-bottom: 0.5rem;
}

/* Tags */
.blog-details-sections .tags-section {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e7eb;
}

.blog-details-sections .tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.blog-details-sections .tags-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
}

.blog-details-sections .tag {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background-color: #e0e7ff;
    color: #4338ca;
    border-radius: 9999px;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all 0.2s ease;
}

.blog-details-sections .tag:hover {
    background-color: #c7d2fe;
    transform: scale(1.05);
}

/* Comments section */
.blog-details-sections .comments-section {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e7eb;
}

.blog-details-sections .comments-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1.5rem;
}

/* Comment form */
.blog-details-sections .comment-form {
    margin-bottom: 2rem;
}

.blog-details-sections .form-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.blog-details-sections .form-group {
    margin-bottom: 1rem;
}

.blog-details-sections .form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .blog-details-sections .form-row {
        grid-template-columns: 1fr 1fr;
    }
}

.blog-details-sections .form-input,
.blog-details-sections .form-textarea {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 1rem;
    transition: border-color 0.2s;
}

.blog-details-sections .form-input:focus,
.blog-details-sections .form-textarea:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.blog-details-sections .form-textarea {
    resize: vertical;
    min-height: 100px;
}

.blog-details-sections .submit-btn {
    padding: 0.5rem 1.5rem;
    background-color: #4f46e5;
    color: white;
    border: none;
    border-radius: 0.5rem;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.blog-details-sections .submit-btn:hover {
    background-color: #4338ca;
}

/* Comments list */
.blog-details-sections .comments-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.blog-details-sections .comment {
    display: flex;
    gap: 1rem;
}

.blog-details-sections .comment-avatar {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    object-fit: cover;
}

.blog-details-sections .comment-content {
    flex: 1;
}

.blog-details-sections .comment-box {
    background-color: #f9fafb;
    border-radius: 0.5rem;
    padding: 1rem;
}

.blog-details-sections .comment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.blog-details-sections .comment-author {
    font-weight: 600;
    color: #111827;
}

.blog-details-sections .comment-date {
    font-size: 0.875rem;
    color: #6b7280;
}

.blog-details-sections .comment-text {
    color: #374151;
}

.blog-details-sections .reply-btn {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    color: #4f46e5;
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.2s;
}

.blog-details-sections .reply-btn:hover {
    color: #4338ca;
}

/* Sidebar */
.blog-details-sections .sidebar {
    width: 100%;
}

@media (min-width: 1024px) {
    .blog-details-sections .sidebar {
        width: 20rem;
    }
}

/* Related articles */
.blog-details-sections .related-articles {
    background-color: #ffffff;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
    animation: fadeIn 0.5s ease-in;
    position: sticky;
    top: 2rem;
}

.blog-details-sections .related-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

.blog-details-sections .related-title i {
    margin-right: 0.5rem;
    color: #4f46e5;
}

.blog-details-sections .related-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.blog-details-sections .related-item {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    border-radius: 0.5rem;
    overflow: hidden;
}

.blog-details-sections .related-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.blog-details-sections .related-item-content {
    display: flex;
    gap: 0.75rem;
}

.blog-details-sections .related-image {
    width: 6rem;
    height: 5rem;
    object-fit: cover;
    border-radius: 0.25rem;
}

.blog-details-sections .related-info {
    flex: 1;
}

.blog-details-sections .related-post-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #111827;
    margin-bottom: 0.25rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-details-sections .related-date {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/************GUEST DETAILS PAGE START HERE************/


.guest-details-section .guest-details-container {
    max-width: 800px;
    margin: 0 auto;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    padding: 30px;
}

.guest-details-section .section-title {
    font-size: 24px;
    color: #333;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
}

.guest-details-section .form-group {
    margin-bottom: 20px;
}

.guest-details-section .form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.guest-details-section .form-row .form-group {
    flex: 1;
    margin-bottom: 0;
}

.guest-details-section label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #444;
    font-size: 14px;
}

.guest-details-section input, .guest-details-section select, .guest-details-section textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    transition: border-color 0.3s;
}

.guest-details-section input:focus, .guest-details-section select:focus, .guest-details-section textarea:focus {
    outline: none;
    border-color: #5b6cff;
    box-shadow: 0 0 0 3px rgba(91, 108, 255, 0.1);
}

.guest-details-section .checkbox-group {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.guest-details-section .checkbox-group input {
    width: auto;
    margin-right: 10px;
}

.guest-details-section .checkbox-group label {
    margin-bottom: 0;
    font-weight: normal;
}

.guest-details-section .guest-counter {
    display: flex;
    align-items: center;
    gap: 15px;
    background: #f8f9fa;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    margin-top: 10px;
}

.guest-details-section .guest-counter button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: white;
    font-size: 18px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.guest-details-section .guest-counter button:hover {
    background: #5b6cff;
    color: white;
    border-color: #5b6cff;
}

.guest-details-section .guest-counter input {
    width: 70px;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    border: none;
    background: transparent;
}

.guest-details-section .guest-counter span {
    font-size: 16px;
    color: #555;
}

.guest-details-section .additional-guests {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.guest-details-section .additional-guests-title {
    font-weight: 600;
    margin-bottom: 15px;
    color: #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.guest-details-section .add-guest-btn {
    background: #5b6cff;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s;
}

.guest-details-section .add-guest-btn:hover {
    background: #4a5bcc;
}

.guest-details-section .guest-item {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 15px;
    position: relative;
    border: 1px solid #e0e0e0;
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.guest-details-section .guest-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.guest-details-section .guest-number {
    font-weight: 600;
    color: #5b6cff;
}

.guest-details-section .remove-guest {
    background: #ff4757;
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s;
}

.guest-details-section .remove-guest:hover {
    background: #ff3838;
}

.guest-details-section .submit-btn {
    background: #5b6cff;
    color: white;
    border: none;
    padding: 14px 30px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    width: 100%;
    margin-top: 10px;
    transition: background 0.3s;
}

.guest-details-section .submit-btn:hover {
    background: #4a5bcc;
}

.guest-details-section .empty-state {
    text-align: center;
    padding: 20px;
    color: #666;
    font-style: italic;
}

@media (max-width: 600px) {
    .guest-details-section .form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .guest-details-section .form-row .form-group {
        margin-bottom: 20px;
    }
    
    .guest-details-section .guest-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}