/* ==========================================================================
   NexTour — homepage additions
   1) Hero search tabs (Tour / Homestay / Honeymoon)
   2) Discounts & Offers banner slider
   ========================================================================== */

/* ---- 1. Hero search tabs ---- */
/* extra headroom so the overlapping tabs clear the form inputs */
.tp-booking-6-form.nx-has-tabs { padding-top: 48px; }

.nx-hero-tabs {
   position: absolute;
   top: 0;
   left: 26px;                     /* align with the form's content (the "Location" label) */
   transform: translateY(-50%);   /* centre the row on the form's top edge → 50% in / 50% out */
   z-index: 4;
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   margin: 0;
}
.nx-hero-tab {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   cursor: pointer;
   background: var(--tp-common-white, #fff);
   border: 1px solid #e7edf5;
   color: #0e1b2c;
   font-family: var(--tp-ff-inter, Inter, sans-serif);
   font-weight: 600;
   font-size: 11px;
   line-height: 1;
   padding: 5px 13px 5px 5px;
   border-radius: 50px;
   box-shadow: 0 4px 12px rgba(2, 20, 43, .08);
   transition: box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.nx-hero-tab .nx-hero-tab-icon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 21px;
   height: 21px;
   border-radius: 50%;
   background: #eaf2ff;
   color: var(--tp-theme-1, #1781FE);
   font-size: 10px;
   transition: background .25s ease, color .25s ease;
}
.nx-hero-tab:hover {
   box-shadow: 0 8px 20px rgba(2, 20, 43, .12);
   border-color: #d7e2f0;
}
.nx-hero-tab.active {
   background: var(--tp-theme-1, #1781FE);
   border-color: var(--tp-theme-1, #1781FE);
   color: #fff;
}
.nx-hero-tab.active .nx-hero-tab-icon {
   background: rgba(255, 255, 255, .22);
   color: #fff;
}
@media (max-width: 575px) {
   .nx-hero-tabs { left: 26px; }
   .tp-booking-6-form.nx-has-tabs { padding-top: 44px; }
   .nx-home-hero .nx-services-redirect { padding-top: 50px; }
}

/* ---- visible border on the (dark glass) hero booking-form fields ---- */
.nx-home-hero .tp-booking-6-form .tp-booking-location-input {
   border: 1px solid rgba(255, 255, 255, .30);
   border-radius: 10px;
}
/* drop the old vertical divider — each field is its own bordered box now */
.nx-home-hero .tp-booking-6-form .tp-booking-location-input::before { display: none; }
.nx-home-hero .tp-booking-6-form .tp-booking-location-input:focus-within {
   border-color: #fff;
}
/* single focus indicator: the wrapper border. Kill the input's own outline/border
   so focusing never shows a second ring. */
.nx-home-hero .tp-booking-6-form .tp-input,
.nx-home-hero .tp-booking-6-form .tp-input:focus,
.nx-home-hero .tp-booking-6-form .tp-input:focus-visible {
   border: 0;
   outline: none;
   box-shadow: none;
}
/* the guest dropdown is a white panel — its counter numbers must be dark, not the
   white the hero form uses elsewhere (otherwise they're invisible). */
.nx-home-hero .tp-booking-6-form .tp-booking-quantity-wrap .tp-input { color: #0e1b2c; }

/* ---- 2. Discounts & Offers banner slider ---- */
.nx-offers-area {
   padding-top: 100px;
   padding-bottom: 55px;
}
/* The services section used a big top pad (280px) to clear the hero when it came
   right after it. The offers section now sits between them, so reset that spacing
   to remove the large empty gap. */
.nx-home-hero .nx-services-redirect {
   margin-top: 0;
   padding-top: 70px;
}
.nx-offers-slider {
   overflow: hidden;
   padding-bottom: 6px;
}
.nx-offers-slider .swiper-slide {
   height: auto;
}
.nx-offer-card {
   display: block;
   position: relative;
   border-radius: 20px;
   overflow: hidden;
   /* matches the offer image (648×344). The slot keeps this ratio, so a bigger
      upload is scaled to fit and the card size stays exactly the same. */
   aspect-ratio: 648 / 344;
   box-shadow: 0 12px 30px rgba(2, 20, 43, .10);
}
.nx-offer-card img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
   transition: transform .5s ease;
}
.nx-offer-card:hover img {
   transform: scale(1.05);
}
.nx-offers-area .swiper-pagination {
   position: static;
   margin-top: 34px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
}
.nx-offers-area .swiper-pagination-bullet {
   width: 9px;
   height: 9px;
   margin: 0 !important;
   background: #c9d4e5;
   opacity: 1;
   transition: width .25s ease, background .25s ease;
}
.nx-offers-area .swiper-pagination-bullet-active {
   width: 26px;
   border-radius: 6px;
   background: var(--tp-theme-1, #1781FE);
}
.nx-offers-empty {
   text-align: center;
   color: #6b7a90;
   padding: 30px 0;
}
.nx-offers-loading {
   display: flex;
   justify-content: center;
   align-items: center;
   min-height: 200px;
}
.nx-offers-loading::after {
   content: "";
   width: 40px;
   height: 40px;
   border: 3px solid #c9d4e5;
   border-top-color: var(--tp-theme-1, #1781FE);
   border-radius: 50%;
   animation: nx-offers-spin .7s linear infinite;
}
@keyframes nx-offers-spin { to { transform: rotate(360deg); } }
@media (max-width: 767px) {
   .nx-offers-area { padding-top: 70px; padding-bottom: 60px; }
}

/* Visa Assistance modal */
.nx-visa-modal .modal-content{border:0;border-radius:16px;overflow:hidden;box-shadow:0 24px 60px rgba(10,37,64,.25)}
.nx-visa-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 24px;background:#0A2540;color:#fff}
.nx-visa-head .modal-title{margin:0;font-size:20px;font-weight:600}
.nx-visa-head .btn-close{filter:invert(1) grayscale(1);opacity:.8}
.nx-visa-body{padding:24px}
.nx-visa-lead{margin:0 0 18px;color:#64748b;font-size:14px}
.nx-visa-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.nx-visa-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.nx-visa-full{margin-top:0}
.nx-visa-field label{font-size:13px;font-weight:600;color:#0A2540}
.nx-visa-field label span{color:#EF2B10}
.nx-visa-field input,.nx-visa-field textarea{width:100%;border:1px solid #e2e8f0;border-radius:10px;padding:11px 14px;font-size:14px;color:#0A2540;background:#fff;transition:border-color .2s}
.nx-visa-field input:focus,.nx-visa-field textarea:focus{outline:none;border-color:#1781FE;box-shadow:0 0 0 3px rgba(23,129,254,.12)}
.nx-visa-field input:invalid:not(:placeholder-shown){border-color:#EF2B10}
.nx-visa-submit{margin-top:6px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
@media (max-width:575px){.nx-visa-grid{grid-template-columns:1fr}}
