/* =============================================================
   Core Theme Tokens (centralized)
   ============================================================= */
:root {
  /* New tokens */
  --accent: #d27219;
  --accent-alt: #bf5f08;
  --bg-primary: #faf7f4;
  --bg-secondary: #ffffff;
  --surface: #ffffff;
  --surface-alt: #f3ede7;
  --text-primary: #2b241d;
  --text-secondary: #665b52;
  --border: #e3d9cf;
  --shadow-color: 27 23 19;
  --radius-s: 6px;
  --radius-m: 14px;
  --radius-l: 22px;
  --transition: .25s cubic-bezier(.4,.2,.2,1);
  --header-height: 100px;
  /* Backwards compatibility (legacy variable names) */
  --primary-color: var(--accent);
  --secondary-color: var(--accent-alt);
  --card-bg: rgba(255,255,255,0.5);
  --shadow: rgba(0,0,0,.1);
}

[data-theme="dark"] {
  --accent: #f09a3e;
  --accent-alt: #e1841b;
  --bg-primary: #181c1f;
  --bg-secondary: #20252a;
  --surface: #242b30;
  --surface-alt: #2d353b;
  --text-primary: #f3ede7;
  --text-secondary: #c9c0b7;
  --border: #3b444b;
  --shadow-color: 0 0 0;
  --card-bg: rgba(36,43,48,0.55);
  --shadow: rgba(0,0,0,.35);
}

/* Theme Toggle Floating Button */
.theme-toggle {position:fixed;right:20px;bottom:20px;background:var(--accent);color:#fff;border:none;border-radius:50%;width:50px;height:50px;cursor:pointer;box-shadow:0 4px 18px -4px rgba(var(--shadow-color)/.35);z-index:1200;display:flex;align-items:center;justify-content:center;transition:background var(--transition), transform var(--transition);} 
.theme-toggle:hover {transform:translateY(-4px) scale(1.05);background:var(--accent-alt);} 
.theme-toggle:active {transform:translateY(-1px) scale(.96);} 

/* Base */
html,body {margin:0;padding:0;min-height:100%;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;background:var(--bg-primary);color:var(--text-secondary);-webkit-font-smoothing:antialiased;}
body {transition:background .45s ease,color .35s ease;}

/* Hero Section */
.hero h1 span {color:var(--accent);transition:color var(--transition);} 

.hero {
  text-align: center;
  margin-bottom: 110px;
  padding: 0 20px;
}

.hero h1 {
  font-size: clamp(2rem, 5vw, 3rem);
  margin-bottom: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  color: var(--text-primary);
}

.hero .subtitle {
  font-size: 1.5rem;
  color: var(--text-secondary);
  margin-bottom: 10px;
}

.hero .desc {
  font-size: 1.1rem;
  color: var(--text-secondary);
  margin-bottom: 25px;
}

/* About Preview */
/* About preview card */
.about-preview {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-m);padding:24px 28px;margin:30px auto 48px;max-width:760px;box-shadow:0 4px 14px -4px rgba(var(--shadow-color)/.12);transition:background var(--transition),box-shadow var(--transition);} 
[data-theme="dark"] .about-preview {box-shadow:0 6px 22px -8px rgba(0,0,0,.55);} 

.about-preview h2 {
  margin-top: 0;
  color: var(--text-primary);
}

.about-preview a {color:var(--accent);text-decoration:underline;}
.about-preview a:hover {color:var(--accent-alt);} 

/* Featured Dishes */
.featured-dishes {
  margin: 40px 0;
}

.featured-dishes h2 {
  text-align: center;
  color: var(--text-primary);
  margin-bottom: 24px;
}
.dishes-grid {
  display: flex;
  gap: 32px;
  justify-content: center;
  flex-wrap: wrap;
}
.dish-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-m);padding:18px 20px 16px;max-width:220px;text-align:center;box-shadow:0 4px 14px -6px rgba(var(--shadow-color)/.16);transition:transform var(--transition),box-shadow var(--transition),background var(--transition);} 
.dish-card:hover {transform:translateY(-6px);box-shadow:0 12px 30px -10px rgba(var(--shadow-color)/.4);} 
[data-theme="dark"] .dish-card {box-shadow:0 10px 28px -12px rgba(0,0,0,.65);} 
.dish-card img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: 10px;
}
.dish-card h3 {
  margin: 10px 0 6px 0;
  font-size: 1.15rem;
}
.dish-card p {
  font-size: 0.98rem;
  color: #5a4636;
}

/* Contacts Section */
.contacts-section {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-m);padding:28px 30px;margin:60px auto 10px;max-width:760px;box-shadow:0 4px 18px -8px rgba(var(--shadow-color)/.18);text-align:center;} 
[data-theme="dark"] .contacts-section {box-shadow:0 8px 30px -14px rgba(0,0,0,.7);} 
.contacts-section h2 {
  margin-top: 0;
}
.contacts-section a {
  color: #e67e22;
  text-decoration: underline;
}
/* (Removed duplicated legacy root/body/background) */

.page-wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding-top: var(--header-height);
}

.container {
  flex: 1;
}

/* Full‑width header, no overlap, longer left↔right */
#main-header {position:fixed;top:0;left:0;width:100%;height:var(--header-height);background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 50px;z-index:1000;transition:background .35s,height .35s,box-shadow .35s;box-shadow:0 4px 18px -8px rgba(var(--shadow-color)/.25);} 
#main-header.scrolled {height:70px;background:var(--surface-alt);box-shadow:0 6px 22px -10px rgba(var(--shadow-color)/.4);} 
[data-theme="dark"] #main-header {background:var(--surface);} 
[data-theme="dark"] #main-header.scrolled {background:var(--surface-alt);} 

/* Nav inner layout */
#nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}

/* Logo and nav container layout */
.logo-container {
  display: flex;
  align-items: center;
}

.nav-list {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  list-style: none;
  gap: 32px;
  margin: 0;
  padding-right: 60px;
  height: 100%; /* Ensure full height */
}

.nav-list li a {color:var(--text-secondary);text-decoration:none;font-weight:600;font-size:16px;position:relative;padding:6px 4px;transition:color var(--transition);} 
.nav-list li a:hover,.nav-list li a.active{color:var(--accent);} 
.nav-list li a::after {content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent);transition:width var(--transition);} 
.nav-list li a:hover::after,.nav-list li a.active::after{width:100%;} 

/* Fix View Menu button styling */
#menu {display:inline-block;padding:12px 34px;margin-top:20px;background:var(--accent);color:#fff;border:2px solid var(--accent);border-radius:50px;transition:background var(--transition),transform var(--transition),box-shadow var(--transition);} 
#menu:hover {background:var(--accent-alt);transform:translateY(-3px);box-shadow:0 10px 28px -8px rgba(var(--shadow-color)/.4);} 
#menu a {color:#fff;text-decoration:none;font-weight:600;font-size:16px;} 

/* Keep hero clear of the header */
.container#main-div {
  min-height: calc(100vh - var(--header-height));
  padding: 60px 20px 60px;
  box-sizing: border-box;
}

/* Adjust padding-top for main content to avoid overlap */
.container#main-div {
  /* Reduced gap below fixed header */
  padding-top: calc(var(--header-height) + 8px);
  margin-top: 0; /* remove extra vertical space */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  padding: 40px 20px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* Anchor offset so clicking “Home/Contacts” doesn’t hide titles */
#main-div,
#contacts {
  scroll-margin-top: calc(var(--header-height) + 12px);
}

/* Fix quote styling */
#quote {
  font-style: italic;
  font-size: 1.1rem;
  margin: 10px 0 30px;
  opacity: 0.85;
}

#welcome {
  font-size: 2.5rem;
  margin-bottom: 10px;
}

/* Contact Section - Flex Layout */
.contact-section {
  background: rgba(255, 255, 255, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 10px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
  padding: 30px;
  margin: 40px auto;
  max-width: 1200px; /* Increased from 1000px to give more space */
}

.contact-flex-container {
  display: flex;
  flex-direction: row;
  gap: 30px;
  align-items: stretch;
  min-height: 300px; /* Set minimum height to ensure sections are substantial */
}

/* Left side - Map */
.contact-map {
  flex: 2; /* Changed from 1 to 2 to make map larger */
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.embed-map-responsive {
  width: 100%;
  height: 100%;
  min-height: 300px; /* Ensure minimum height */
  border-radius: 8px;
  overflow: hidden;
}

.embed-map-container {
  width: 100%;
  height: 100%;
  min-height: 300px;
}

.embed-map-container iframe {
  width: 100%;
  height: 100%;
  min-height: 300px;
  border: none;
}

/* Right side - Contact details */
.contact-details {
  flex: 1.5; /* Adjusted to balance with map */
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 20px;
}

#contacts {
  padding: 0;
  margin: 0;
}

#contacts p {
  margin: 30px 0; /* Increased vertical spacing */
  padding-left: 50px;
  position: relative;
  font-size: 18px; /* Slightly larger */
  line-height: 28px; /* Increased line height */
}

#contacts p:before {
  content: "";
  width: 36px;
  height: 36px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
}

/* Phone icon */
#contacts p:nth-child(1):before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e67e22'%3E%3Cpath d='M20 10.999h2C22 5.869 18.127 2 12.99 2v2C17.052 4 20 6.943 20 10.999z'%3E%3C/path%3E%3Cpath d='M13 8c2.103 0 3 .897 3 3h2c0-3.225-1.775-5-5-5v2zm3.422 5.443a1.001 1.001 0 0 0-1.391.043l-2.393 2.461c-.576-.11-1.734-.471-2.926-1.66-1.192-1.193-1.553-2.354-1.66-2.926l2.459-2.394a1 1 0 0 0 .043-1.391L6.859 3.513a1 1 0 0 0-1.391-.087l-2.17 1.861a1 1 0 0 0-.29.649c-.015.25-.301 6.172 4.291 10.766C11.305 20.707 16.323 21 17.705 21c.202 0 .326-.006.359-.008a.992.992 0 0 0 .648-.291l1.86-2.171a1 1 0 0 0-.086-1.391l-4.064-3.696z'%3E%3C/path%3E%3C/svg%3E");
}

/* Email icon */
#contacts p:nth-child(2):before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e67e22'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4.7-8 5.334L4 8.7V6.297l8 5.333 8-5.333V8.7z'%3E%3C/path%3E%3C/svg%3E");
}

/* Address icon */
#contacts p:nth-child(3):before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e67e22'%3E%3Cpath d='M12 2C7.589 2 4 5.589 4 9.995 3.971 16.44 11.696 21.784 12 22c0 0 8.029-5.56 8-12 0-4.411-3.589-8-8-8zm0 12c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z'%3E%3C/path%3E%3C/svg%3E");
}

/* Responsive layout */
@media (max-width: 768px) {
  .contact-flex-container {
    flex-direction: column;
  }
  
  .embed-map-responsive {
    min-height: 200px;
  }
}

/* Responsive */
@media (max-width: 900px) {
  #main-header { 
    padding: 0 24px; 
  }
  #nav { 
    gap: 28px; 
  }
}

@media (max-width: 700px) {
  #main-header { 
    padding: 0 18px; 
  }
  #nav { 
    gap: 28px; 
  }
  #imglogo { 
    height: 58px; 
  }
}

@media (max-width: 768px) {
  .nav-list {
    gap: 15px;
    font-size: 14px;
  }
  
  #welcome {
    font-size: 2rem;
    text-align: center;
  }
  
  #quote {
    text-align: center;
  }
  
  .container#main-div {
    text-align: center;
  }
}
  
@media (max-width: 600px) {
  .nav-list {
    display: none;
  }
  
  .contact-container {
    flex-direction: column;
  }
  
  .contact-form, .contact-info {
    min-width: 100%;
  }
}

/* Footer styling */
#footer {width:100%;background:var(--surface-alt);border-top:1px solid var(--border);text-align:center;padding:26px 0 22px;margin-top:auto;box-shadow:0 -4px 14px -6px rgba(var(--shadow-color)/.25);} 
#footer p {margin:5px 0;color:var(--text-secondary);} 
[data-theme="dark"] #footer {background:var(--surface);} 

.footer-logo {
  height: 60px;
  margin-bottom: 10px;
  opacity: .9;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.25));
}

#credits {
  font-size: 0.9rem;
  opacity: 0.8;
}

/* Hamburger menu styling */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  width: 44px;
  height: 44px;
  cursor: pointer;
  padding: 8px 6px;
  border-radius: 10px;
  background: transparent;
  transition: background 0.2s;
  z-index: 1201;
}

 .hamburger span {
   display: block;
   height: 5px;
   width: 100%;
   background-color: #3e2b1e;
   border-radius: 4px;
   transition: all 0.3s cubic-bezier(.4,.2,.2,1);
   margin: 3px 0;
 }
 .hamburger:active, .hamburger:focus {
   background: rgba(210,114,25,0.08);
   outline: none;
 }


/* Mobile menu overlay */
/* Mobile menu */
.mobile-menu {position:fixed;top:0;right:0;width:0;height:100vh;background:var(--surface);overflow:hidden;transition:width var(--transition);z-index:1000;box-shadow:-5px 0 25px -6px rgba(var(--shadow-color)/.22);border-left:1px solid var(--border);} 
[data-theme="dark"] .mobile-menu {background:var(--surface-alt);} 

.mobile-menu.active {
  width: 70%;
  box-shadow: -5px 0 25px rgba(0,0,0,0.1);
}

.mobile-nav-list {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 50px 20px;
}

.mobile-menu.active .mobile-nav-list {
  display: flex;
  opacity: 1;
  transition-delay: 0.2s;
}

.mobile-nav-list li {
  margin: 15px 0;
  list-style: none;
}

 .mobile-nav-list li a {color:var(--text-secondary);text-decoration:none;font-weight:600;font-size:18px;transition:color var(--transition);} 
 .mobile-nav-list li a:hover, .mobile-nav-list li a.active {color:var(--accent);} 

/* Hamburger icon animation */
.mobile-nav-list li a:hover {
  font-weight: 600;
  transition: color 0.3s;
}

.hamburger.active span:first-child {
  transform: translateY(9px) rotate(45deg);
}

.hamburger.active span:last-child {
  transform: translateY(-9px) rotate(-45deg);
  opacity: 0;
}

/* Update media queries for mobile menu */
@media (max-width: 600px) {
  .hamburger {
    display: flex;
  }
  .logo-container {
    justify-content: space-between;
  }
  #main-header {
    padding: 0 18px;
  }
  .nav-list {
    display: none;
  }
  .contact-container {
    flex-direction: column;
  }
  
  .contact-form, .contact-info {
    min-width: 100%;
  }
  
  body.menu-open {
    overflow: hidden;
  }
}

.menu{
  display: flex;
  /* gap: 20px; */
}

.indian-menu {
  background: #fffbe6;
  padding: 2.5rem 1.5rem 3rem;
  text-align: center;
  border-radius: 22px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
  max-width: 1400px;
  margin: 0 auto 30px;
}

.indian-menu h2 {
    color: #ff9800;
    margin-bottom: 2rem;
    font-size: 2.2rem;
    letter-spacing: 1px;
}

.menu-items {
  /* Responsive grid for better wrapping of 5 items */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 2rem;
  justify-items: center;
  align-items: stretch;
  max-width: 1200px;
  margin: 0 auto;
}

.menu-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-m);width:100%;max-width:240px;padding:1rem 1.1rem 1.4rem;transition:transform var(--transition),box-shadow var(--transition);display:flex;flex-direction:column;position:relative;box-shadow:0 4px 16px -6px rgba(var(--shadow-color)/.18);} 
.menu-card:hover {transform:translateY(-6px);box-shadow:0 12px 30px -8px rgba(var(--shadow-color)/.35);} 
[data-theme="dark"] .menu-card {box-shadow:0 10px 30px -12px rgba(0,0,0,.6);} 

.menu-card img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 0.7rem;
  margin-bottom: 1rem;
  background: linear-gradient(135deg,#f7f7f7,#ececec);
  position: relative;
}

.menu-card h3 {margin:.5rem 0 .3rem;color:var(--accent);font-size:1.15rem;font-weight:600;letter-spacing:.5px;} 

.menu-card p {font-size:.92rem;color:var(--text-secondary);margin-top:.35rem;line-height:1.35rem;flex:1;} 

/* Fallback style if image fails (shows logo centered) */
.menu-card img.fallback {
  object-fit: contain;
  padding: 18px;
  filter: grayscale(.15);
}

/* Gallery Page */
.gallery-hero {
  text-align: center;
  margin: 40px 0 55px;
}
.gallery-hero h1 {
  font-size: 2.8rem;
  margin: 0 0 10px;
  letter-spacing: 1px;
}
.gallery-hero p {font-size:1.05rem;max-width:680px;margin:0 auto;color:#5a4636;}

.gallery-wrapper {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto 70px;
  padding: 0 18px;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(240px,1fr));
  gap: 22px;
}

.gallery-item {position:relative;overflow:hidden;border-radius:18px;cursor:pointer;aspect-ratio:4/3;background:#f3f3f3;box-shadow:0 4px 14px rgba(0,0,0,.07);}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease, filter .5s ease;}
.gallery-item:hover img{transform:scale(1.08);filter:brightness(.92);} 
.gallery-item:after{content:attr(data-title);position:absolute;left:0;right:0;bottom:0;padding:8px 12px;font-size:.85rem;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0));color:#fff;letter-spacing:.5px;}

/* Lightbox */
.lightbox-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s;z-index:3000;padding:30px;}
.lightbox-overlay.active{opacity:1;pointer-events:all;}
.lightbox-content{max-width:90vw;max-height:80vh;position:relative;}
.lightbox-content img{max-width:100%;max-height:80vh;border-radius:14px;box-shadow:0 10px 35px rgba(0,0,0,.4);}
.lightbox-close{position:absolute;top:-14px;right:-14px;background:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:22px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;}
.lightbox-caption{margin-top:14px;text-align:center;color:#fff;font-size:1rem;letter-spacing:.5px;}

@media (max-width:600px){
  .gallery-hero h1{font-size:2.2rem;}
  .gallery-grid{gap:16px;}
  .lightbox-content img{max-height:60vh;}
}

/* Media queries for better mobile responsiveness */
@media screen and (max-width: 768px) {
  /* Navigation */
  .hamburger {
    display: block;
  }
  .nav-list {
    display: none;
  }
  
  /* Layout */
  .container {
    padding: 0 20px;
  }
  
  /* Featured Dishes */
  .dishes-grid {
    gap: 16px;
  }
  .dish-card {
    max-width: 100%;
    width: calc(100% - 32px);
  }
  .dish-card img {
    height: 180px;
  }
  
  /* About Preview & Contacts Section */
  .about-preview,
  .contacts-section {
    margin: 20px;
    padding: 16px;
  }
  
  /* Contact Map */
  .contact-flex-container {
    flex-direction: column;
  }
  .contact-map,
  .contact-info {
    width: 100%;
    padding: 0;
  }
  .embed-map-container {
    height: 300px;
  }
}

@media screen and (max-width: 480px) {
  /* Hero Section */
  .hero {
    margin-bottom: 60px;
  }
  .hero h1 {
    font-size: 2rem;
  }
  .hero .subtitle {
    font-size: 1.2rem;
  }
  .hero .desc {
    font-size: 1rem;
  }
  
  /* Navigation */
  .logo-container img {
    height: 60px;
  }
  
  /* Featured Dishes */
  .dish-card {
    padding: 12px;
  }
  .dish-card img {
    height: 160px;
  }
  .dish-card h3 {
    font-size: 1.1rem;
  }
  
  /* Contacts */
  .embed-map-container {
    height: 250px;
  }
}

/* Fix backdrop-filter vendor prefixes */
.header {
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  backdrop-filter: blur(18px) saturate(160%);
}

.mobile-menu {
/* Mobile menu close (X) button */
.mobile-menu-close {
  position: absolute;
  top: 18px;
  right: 18px;
  background: var(--surface-alt);
  color: var(--accent);
  border: none;
  font-size: 2.2rem;
  font-weight: 700;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1202;
  box-shadow: 0 2px 8px rgba(var(--shadow-color)/.12);
  transition: background 0.2s, color 0.2s;
}
.mobile-menu-close:hover, .mobile-menu-close:focus {
  background: var(--accent);
  color: #fff;
  outline: none;
}
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.lightbox-overlay {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
