body {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  transition: background 0.3s, color 0.3s;
}

html {
  scroll-behavior: smooth;
}




/* NAVBAR */
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 8%;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

  position: relative;
  z-index: 1000;
  /* ✅ ek hi rakho */
  gap: 20px;
}

/* LOGO */
.logo img {
  height: 130px;
  /* 👈 thoda balanced */
  width: auto;
  object-fit: contain;
  transition: 0.3s ease;
}

/* LINKS */
.nav-links {
  display: flex;
  align-items: center;
  gap: 25px;
  margin-left: auto;
  /* 👈 ye important hai */
}

.nav-links a {
  text-decoration: none;
  color: #333;
  font-weight: 500;
}

.nav-links a:hover {
  color: #00d2ff;
}

.nav-links a.active {
  color: #00d2ff;
  font-weight: 600;
}

/* Dark/light theme toggle */

/* ================= THEME BUTTON ================= */
.theme-toggle {
  margin-left: 15px;
  padding: 8px 12px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  background: #222;
  color: #fff;
  font-size: 16px;
}

/* ================= DARK MODE BASE ================= */
body.dark-mode {
  background: #121212;
  color: #ffffff;
}

/* ================= NAVBAR ================= */
body.dark-mode .nav {
  background: #1e1e1e;
}

/* DARK MODE NAV LINKS */
body.dark-mode .nav-links a {
  color: #ddd;
  /* light text */
}

/* HOVER */
body.dark-mode .nav-links a:hover {
  color: #00d2ff;
}

/* ACTIVE LINK */
body.dark-mode .nav-links a.active {
  color: #00d2ff;
  font-weight: 600;
}

body.dark-mode .nav-links a {
  color: #fff;
}

body.dark-mode .nav-links a:hover {
  color: #00d2ff;
}

body.dark-mode .btn-enquire {
  background: #00d2ff;
}

body.dark-mode .theme-toggle {
  background: #fff;
  color: #000;
}

/* DARK MODE - FEATURE BUTTONS */
body.dark-mode .room-features span {
  background: #2a2a2a;
  /* 👈 dark bg */
  color: #fff;
  /* 👈 text visible */
  border: 1px solid #444;
}

/* price span color */
body.dark-mode .price span {
  color: white !important;
}

body.dark-mode .btn-outline-dark {
  color: black;
  border: 1px solid #888;
}

body.dark-mode .btn-outline-dark:hover {
  background: #4e54c8;
  /* tumhara theme color */
  border-color: #4e54c8;
  color: #fff;
}

/* Hover effect */
body.dark-mode .room-features span:hover {
  background: #4e54c8;
  /* same theme color */
  color: #fff;
}

/* ================= SECTIONS ================= */
body.dark-mode section {
  background: #121212;
  /* 👈 transparent hata diya */
}

/* ================= CARDS ================= */
body.dark-mode .card,
body.dark-mode .custom-card,
body.dark-mode .service-card,
body.dark-mode .testimonial-box,
body.dark-mode .room-card,
body.dark-mode .why-card {
  background: #1e1e1e;
  color: #fff;
  border-color: #333;
}

/* ================= TEXT ================= */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode p,
body.dark-mode span,
body.dark-mode li {
  color: #ffffff;
}

/* Muted text */
body.dark-mode .text-muted {
  color: #bbbbbb !important;
}

/* ================= LINKS ================= */
body.dark-mode a {
  color: #ffffff;
}

/* ================= INPUT ================= */
body.dark-mode input,
body.dark-mode textarea {
  background: #1e1e1e;
  color: #fff;
  border: 1px solid #444;
}

/* ================= BUTTON ================= */
body.dark-mode .btn-secondary {
  background: #444;
  color: #fff;
}

/* ================= FOOTER ================= */
body.dark-mode .footer {
  background: #1e1e1e;
  color: #fff;
}

body.dark-mode .footer p,
body.dark-mode .footer li {
  color: #ccc;
}

body.dark-mode .footer .social a {
  color: #fff;
}

body.dark-mode .footer .social a:hover {
  color: #00d2ff;
}

/* ================= WHATSAPP ICON ================= */
body.dark-mode .whatsapp-btn img {
  filter: brightness(1.2);
}

/* End Dark/light theme */

/* Available rooms page Dark/light theme */
body.dark-mode .section-badge {
  background: #1e1e1e;
  color: white;
}

body.dark-mode .main-heading {
  color: #fff;
}

body.dark-mode .section-subtext {
  color: #aaa;
}

/* FILTER BOX DARK MODE */
body.dark-mode .filter-box {
  background: #1e1e1e;
  border: 1px solid #333;
  border-radius: 12px;
}

/* INPUT */
body.dark-mode .form-control {
  background: #2a2a2a;
  color: #fff;
  border: 1px solid #444;
}

body.dark-mode .form-control::placeholder {
  color: #aaa;
}

/* SELECT */
body.dark-mode .form-select {
  background: #2a2a2a;
  color: #fff;
  border: 1px solid #444;
}

/* REMOVE DEFAULT ARROW */
body.dark-mode .form-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background-color: #2a2a2a;
  color: #fff;
  border: 1px solid #444;

  /* CUSTOM WHITE ARROW */
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'%3e%3cpath d='M7.247 11.14 2.451 5.658c-.566-.65-.106-1.658.753-1.658h9.592c.86 0 1.32 1.008.753 1.658L8.753 11.14a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");

  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px;
}

/* BUTTON */
body.dark-mode .btn-orange {
  background: #00d2ff;
  color: #fff;
  border: none;
}

body.dark-mode .btn-orange:hover {
  background: #4e54c8;
}

/* CONTACT BOX */
body.dark-mode .contact-box {
  background: #1e1e1e;
  color: #fff;
  border-radius: 12px;
  border: 1px solid #333;
}

body.dark-mode .contact-box p {
  color: #bbb;
}

/* MAP BOX (optional styling) */
body.dark-mode .map-box iframe {
  filter: grayscale(1) invert(0.9);
  /* 👈 dark feel map */
}

/* LOCATION BOX */
body.dark-mode .location-box {
  background: #1e1e1e;
  color: #fff;
  border-radius: 12px;
  border: 1px solid #333;
}

body.dark-mode .location-box p {
  color: #bbb;
}

/* ICON */
body.dark-mode .location-box i {
  color: #00d2ff;
}

/* contact page dark thenme */
/* INFO CARD DARK MODE */
body.dark-mode .info-card {
  background: #1e1e1e;
  color: #fff;
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #333;
  transition: 0.3s;
}

/* TEXT */
body.dark-mode .info-card p {
  color: #bbb;
}

/* ICON */
body.dark-mode .info-card i {
  color: #00d2ff;
  font-size: 20px;
  margin-bottom: 10px;
}

/* HOVER EFFECT */
body.dark-mode .info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

/* FORM BOX */
body.dark-mode .form-box {
  background: #1e1e1e;
  color: #fff;
  padding: 20px;
  border-radius: 12px;
  border: 1px solid #333;
}

/* HEADING */
body.dark-mode .form-box h5 {
  color: #fff;
}

/* INPUT + TEXTAREA */
body.dark-mode .form-control {
  background: #2a2a2a;
  color: #fff;
  border: 1px solid #444;
}

/* PLACEHOLDER */
body.dark-mode .form-control::placeholder {
  color: #aaa;
}

/* SELECT */
body.dark-mode select.form-control {
  background: #2a2a2a;
  color: #fff;
  border: 1px solid #444;
}

/* BUTTON */
body.dark-mode .btn-green {
  background: #4e54c8;
  color: #fff;
  border: none;
}

body.dark-mode .btn-green:hover {
  background: #000;
}

/* BUTTON */
.btn-enquire {
  padding: 10px 18px;
  border-radius: 25px;
  border: none;

  background: #00d2ff;
  color: #fff;
  cursor: pointer;
}

.btn-enquire:hover {
  background: #000;
}

/* MENU ICON */
.menu-icon {
  display: none;
  font-size: 26px;
  cursor: pointer;
}

.mobile-btn {
  display: none;
}

/* ================= DARK MODE FIX ================= */

body.dark-mode .feature-slider {
  background: #121212;
}

body.dark-mode .feature-card {
  background: #1e1e1e;
  color: #fff;
  box-shadow: 0 5px 15px rgba(255, 255, 255, 0.05);
}

body.dark-mode .feature-card h4 {
  color: #ffffff;
}

body.dark-mode .feature-card p {
  color: #cccccc;
}

/* OPTIONAL: hover effect */
body.dark-mode .feature-card:hover {
  transform: translateY(-5px);
}


/* ================= TESTIMONIAL DARK MODE ================= */

body.dark-mode .testimonials {
  background: #121212;
  color: #fff;
}

body.dark-mode .testimonials h2 {
  color: #fff;
}

body.dark-mode .testimonials .text-muted {
  color: #aaa !important;
}

/* CARD */
body.dark-mode .testimonial-card {
  background: #1e1e1e;
  color: #fff;
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(255, 255, 255, 0.05);
}

/* ACTIVE CARD (center wala highlight) */
body.dark-mode .testimonial-card.active {
  background: #2a2a2a;
  transform: scale(1.05);
}

/* TEXT */
body.dark-mode .testimonial-card p {
  color: #ccc;
}

/* NAME */
body.dark-mode .testimonial-card h6 {
  color: #fff;
}

/* AVATAR */
body.dark-mode .avatar {
  background: #00d2ff;
  color: #fff;
}

/* ================= MOBILE ================= */

@media (max-width: 900px) {

  .menu-icon {
    display: block;
  }

  body.dark-mode .nav-links {
    background: #1e1e1e;
  }

  .desktop-btn {
    display: none;
  }

  .nav-links {
    position: absolute;
    top: 120px;
    left: 0;
    width: 100%;
    background: #fff;
    flex-direction: column;
    align-items: center;
    display: none;
    padding: 20px 0;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  }



  .mobile-btn {
    display: block;
    margin-top: 10px;
  }

  .nav-links a {
    padding: 10px 0;
    width: 100%;
    text-align: center;
  }

}
@media (max-width: 900px) {

    .nav-links.active {
        display: flex;
        background: #dcd3d3;

        position: absolute;
        top: 70px; /* navbar height ke hisab se */
        left: 0;
        width: 100%;

        z-index: 9999;
    }

    .navbar,
    .header,
    nav {
        position: relative;
        z-index: 9999;
    }
}

.footer {
  background: linear-gradient(135deg, #121212, #1e1e1e);
  color: #fff;
  padding: 60px 0 20px;
}

.footer-logo img {
  height: 130px;
  margin-bottom: 15px;
}

.footer p {
  font-size: 14px;
  color: #cfd8dc;
  margin-bottom: 5px;
}

.footer h5 {
  margin-bottom: 20px;
  font-weight: 600;
}

.footer ul {
  list-style: none;
  padding: 0;
}

.footer ul li {
  margin-bottom: 10px;

}

.footer ul li a {
  color: #cfd8dc;
  text-decoration: none;
  font-size: 14px;
  transition: 0.3s;
}

.footer ul li a:hover {
  color: #fff;
}

/* SOCIAL ICONS */
.social {
  margin-top: 20px;
}

.social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: white;
  border-radius: 50%;
  margin-right: 10px;
  color: rgba(255, 255, 255, 0.1);
  transition: 0.3s;
}

.social a:hover {
  background: #00d2ff;
}

/* CONTACT ICON */
.footer i {
  margin-right: 8px;
}

/* SUBSCRIBE BOX */
.subscribe-box {
  display: flex;
  margin-top: 15px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  overflow: hidden;
}

.subscribe-box input {
  flex: 1;
  border: none;
  padding: 10px;
  background: transparent;
  color: #fff;
  outline: none;
}

.subscribe-box input::placeholder {
  color: #ccc;
}

.subscribe-box button {
  background: #00d2ff;
  border: none;
  padding: 10px 15px;
  color: #fff;
  cursor: pointer;
  transition: 0.3s;
}

.subscribe-box button:hover {
  background: #4e54c8;
}

/* FOOTER BOTTOM */
.footer-bottom {
  text-align: center;
  margin-top: 40px;
  font-size: 13px;
  color: #aaa;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 15px;
}

.whatsapp-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
}

.whatsapp-btn img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.25);
  transition: 0.3s;
}

.whatsapp-btn img:hover {
  transform: scale(1.1);
}

.whatsapp-btn::after {
  content: "";
  position: absolute;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(37, 211, 102, 0.4);
  top: 0;
  left: 0;
  animation: pulse 2s infinite;
  z-index: -1;
}

@keyframes pulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  100% {
    transform: scale(1.8);
    opacity: 0;
  }
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .foot-part {
    text-align: center;
  }

  .social {
    justify-content: center;
  }

  .subscribe-box {
    flex-direction: column;
  }

  .subscribe-box button {
    width: 100%;
  }

  .footer h5 {
    margin-top: 20px;
  }
}