/*
  ###########################################################
  # LA VIDA Brand Identity - iRestora PLUS Frontend CSS
  # Primary Palette:
  #   Life Green: #7BA772
  #   Mocha:      #6B421D
  #   Caramel:    #C8A062
  #   Latte:      #F3E9D6
  #   Stone:      #D9D3CA
  ###########################################################
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

:root,
[data-theme="dark"],
body.dark-theme {
  --theme-mode: dark;
  --primary-color: #7BA772;
  /* Life Green */
  --secondary-color: #58834F;
  /* Rich Green */
  --caramel-color: #c1e6b4;
  /* Off-White Sage Green Accent (Replacing Caramel Gold in Dark Mode) */
  --latte-color: #d9fad4;
  /* Light Sage Cream */
  --stone-color: #b6dbb3;
  /* Muted Stone Green */

  --dark-mocha: #2E4628;
  --light-latte: #F0F7EF;
  --cream-white: #FFFFFF;

  /* Layered Dark Mode Color Degrees (Life Green Palette) */
  --bg-main: #43613c;
  /* Base Life Green Background */
  --bg-secondary: #3B5834;
  /* Deeper Section & Filter Background */
  --bg-card: #2A4225;
  /* Deep Forest Green Card Background (High Depth & Contrast) */
  --bg-card-glass: rgba(42, 66, 37, 0.94);
  --header-bg: rgba(59, 88, 52, 0.94);
  --header-border: rgba(220, 234, 215, 0.35);
  --header-text: #FFFFFF;
  --latte-color: #DCEAD7;

  --heading-color: #FFFFFF;
  /* Crisp White Titles */
  --heading-latte: #DCEAD7;
  /* Off-White Sage Cream Accent */
  --paragraph-color: #F0F7EF;
  /* Crisp Body Text */
  --text-muted: #C2DBC0;
  /* Readable Muted Green */
  --default-color: #FFFFFF;
  --border-color: rgba(220, 234, 215, 0.3);

  --font-serif: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --border-radius-sm: 8px;
  --border-radius-md: 16px;
  --border-radius-lg: 24px;
  --border-radius-pill: 50px;

  --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.22);
  --shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.35);
  --shadow-gold: 0 8px 25px rgba(220, 234, 215, 0.25);

  --transition-fast: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
  --transition-smooth: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-theme="light"],
body.light-theme {
  --theme-mode: light;
  --primary-color: #7BA772;
  /* Life Green */
  --secondary-color: #6B421D;
  /* Mocha */
  --caramel-color: #C8A062;
  /* Caramel Gold */
  --latte-color: #F3E9D6;
  /* Latte Cream */
  --stone-color: #D9D3CA;
  /* Stone Gray */

  --dark-mocha: #2D1A0B;
  --light-latte: #FAF6F0;
  --cream-white: #FFFDF9;

  /* Light Mode Tokens (Identity Colors from LA VIDA Logo Presentation.pdf) */
  --bg-main: #FAF6F0;
  --bg-secondary: #F3E9D6;
  --bg-card: #FFFFFF;
  --bg-card-glass: rgba(255, 253, 249, 0.94);
  --header-bg: rgba(255, 253, 249, 0.94);
  --header-border: rgba(107, 66, 29, 0.2);
  --header-text: #2C1A0E;

  --heading-color: #2C1A0E;
  /* Deep Roasted Espresso */
  --heading-latte: #6B421D;
  /* Rich Mocha */
  --paragraph-color: #3D2614;
  /* Rich Dark Coffee Text for Maximum Contrast */
  --text-muted: #6B5546;
  /* Warm Mocha tone */
  --default-color: #2C1A0E;
  --border-color: rgba(107, 66, 29, 0.16);

  --font-serif: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --border-radius-sm: 8px;
  --border-radius-md: 16px;
  --border-radius-lg: 24px;
  --border-radius-pill: 50px;

  --shadow-soft: 0 10px 30px rgba(107, 66, 29, 0.08);
  --shadow-hover: 0 20px 40px rgba(107, 66, 29, 0.14);
  --shadow-gold: 0 8px 25px rgba(200, 160, 98, 0.2);

  --transition-fast: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
  --transition-smooth: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Reset & Base Setup */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background-color: var(--bg-main);
}

body {
  font-family: var(--font-sans) !important;
  background-color: var(--bg-main) !important;
  color: var(--paragraph-color);
  line-height: 1.7;
  position: relative;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6,
.font-serif,
.title,
.section-title {
  font-family: var(--font-serif) !important;
  color: var(--heading-color);
  font-weight: 700;
  letter-spacing: -0.01em;
}

h1 {
  font-size: 3.5rem;
  line-height: 1.15;
}

h2 {
  font-size: 2.75rem;
  line-height: 1.2;
}

h3 {
  font-size: 2rem;
  line-height: 1.25;
}

h4 {
  font-size: 1.5rem;
  line-height: 1.3;
}

h5 {
  font-size: 1.25rem;
  line-height: 1.4;
}

p {
  font-size: 1.05rem;
  color: var(--paragraph-color);
}

.custom-primary,
.sub-heading-tag {
  color: var(--caramel-color) !important;
  font-family: var(--font-sans) !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.75rem;
  display: inline-block;
}

/* =========================================================
   2026 UNIFIED FLOATING DARK MOCHA GLASS CAPSULE NAVBAR
   ========================================================= */

body header.main-header.lavida-floating-header {
  position: fixed !important;
  top: 14px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
  max-width: 1340px !important;
  height: 68px !important;
  background: var(--header-bg) !important;
  /* Dark Luxury Glass Capsule */
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1.5px solid var(--header-border) !important;
  border-radius: 50px !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.25) !important;
  z-index: 1050 !important;
  transition: var(--transition-smooth) !important;
  padding: 0 24px !important;
  display: flex !important;
  align-items: center !important;
  /* overflow: visible so dropdown submenus can render below the capsule */
  overflow: visible !important;
}

/* Navbar Scrolled Active State */
body header.main-header.lavida-floating-header.scrolled {
  top: 8px !important;
  height: 62px !important;
  background: var(--header-bg) !important;
  border-color: var(--header-border) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35) !important;
}

body header.main-header.lavida-floating-header .container {
  height: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

body header.main-header.lavida-floating-header .navbar {
  height: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  /* Never wrap â€” keeps everything in ONE row */
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 !important;
  width: 100% !important;
  background: transparent !important;
}

body header.main-header.lavida-floating-header .navbar-brand {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body header.main-header.lavida-floating-header .navbar-brand img {
  max-height: 42px !important;
  width: auto !important;
  object-fit: contain !important;
  transition: var(--transition-fast) !important;
}

/* Centered Navigation Links â€” no display:flex here so Bootstrap d-none can hide on mobile */
body header.main-header.lavida-floating-header .navbar-nav {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  height: 100% !important;
  list-style: none !important;
  background: transparent !important;
  flex-shrink: 0 !important;
}

/* On desktop (â‰¥992px) the d-lg-flex class from Bootstrap shows the nav,
   we just need to ensure flex layout when it IS shown */
@media (min-width: 992px) {
  body header.main-header.lavida-floating-header .navbar-nav {
    display: flex !important;
  }
}

body header.main-header.lavida-floating-header .navbar-nav .menu-item {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  border-radius: 0 !important;
}

body header.main-header.lavida-floating-header .navbar-nav .menu-item a {
  font-family: var(--font-sans) !important;
  font-weight: 600 !important;
  font-size: 0.92rem !important;
  color: var(--latte-color) !important;
  /* Crisp Warm Latte text */
  padding: 8px 18px !important;
  border-radius: 50px !important;
  transition: var(--transition-fast) !important;
  position: relative !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 38px !important;
  border: 1px solid transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  width: auto !important;
}

body header.main-header.lavida-floating-header .navbar-nav .menu-item a:hover,
body header.main-header.lavida-floating-header .navbar-nav .menu-item a.active {
  color: #FFFFFF !important;
  background-color: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  box-shadow: 0 4px 14px rgba(200, 160, 98, 0.35) !important;
}

/* =========================================================
   ACTION PILL WIDGETS (CART, LANGUAGE, LOGIN)
   ========================================================= */

body header.main-header.lavida-floating-header .header-controls {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body header.main-header.lavida-floating-header .header-controls-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  height: 100% !important;
}

/* Modern Pill Button Capsule */
body header.main-header.lavida-floating-header .header-controls-inner>li,
body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger,
body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children {
  width: auto !important;
  max-width: none !important;
  height: 38px !important;
  border-radius: 50px !important;
  padding: 6px 14px !important;
  margin: 0 !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  background: rgba(200, 160, 98, 0.18) !important;
  border: 1px solid rgba(200, 160, 98, 0.45) !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  min-width: max-content !important;
  position: relative !important;
}

body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover,
body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover {
  background: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(200, 160, 98, 0.35) !important;
}

body header.main-header.lavida-floating-header .header-controls-inner span {
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  color: var(--latte-color) !important;
  transition: var(--transition-fast);
  white-space: nowrap !important;
  display: inline-block !important;
  opacity: 1 !important;
}

body header.main-header.lavida-floating-header .header-controls-inner i {
  font-size: 14px !important;
  color: var(--caramel-color) !important;
  transition: var(--transition-fast);
}

body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover span,
body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover i,
body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover span,
body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover i {
  color: #FFFFFF !important;
}

/* 100% DEAD CENTER NUMBER INSIDE CIRCLE BADGE */
body header.main-header.lavida-floating-header .cart-item-count {
  position: static !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  border-radius: 50% !important;
  background: var(--caramel-color, #C8A062) !important;
  color: #FFFFFF !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  font-family: var(--font-sans) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  padding: 0 !important;
  margin: 0 0 0 6px !important;
  box-shadow: none !important;
  border: none !important;
  flex-shrink: 0 !important;
}

body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover .cart-item-count {
  background: #FFFFFF !important;
  color: #6B421D !important;
  font-weight: 900 !important;
}

/* Submenu Dropdown */
.navbar-nav .submenu,
.header-controls-inner .submenu {
  background: var(--bg-card) !important;
  border-radius: var(--border-radius-md, 14px) !important;
  border: 1px solid rgba(200, 160, 98, 0.4) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5) !important;
  padding: 8px !important;
  min-width: 210px !important;
  top: 115% !important;
  position: absolute !important;
  z-index: 9999 !important;
  list-style: none !important;
}

/* Right-align the rightmost dropdowns so they don't go off-screen */
.header-controls-inner .menu-item-has-children:last-child .submenu,
.header-controls-inner .menu-item-has-children:nth-last-child(2) .submenu {
  left: auto !important;
  right: 0 !important;
}

.submenu .menu-item {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
}

.submenu .menu-item:last-child {
  margin-bottom: 0 !important;
}

.submenu .menu-item a {
  border-radius: var(--border-radius-sm, 8px) !important;
  padding: 10px 16px !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  display: block !important;
  width: 100% !important;
  color: var(--latte-color, #F3E9D6) !important;
  height: auto !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}

.submenu .menu-item a:hover {
  background: var(--caramel-color, #C8A062) !important;
  color: #FFFFFF !important;
  border: none !important;
}


/* =========================================================
   ULTRA-ANIMATED VIBRANT RESTAURANT HERO SECTION
   ========================================================= */

.lavida-hero-section {
  position: relative !important;
  min-height: 90vh !important;
  padding-top: 110px !important;
  display: flex !important;
  align-items: center !important;
  background: var(--bg-main) !important;
  overflow: hidden !important;
}

.lavida-hero-bg {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover !important;
  background-position: center !important;
  filter: brightness(0.85) contrast(1.05) !important;
  /* Bright vivid background image */
  transition: transform 10s ease !important;
  animation: heroBgZoom 20s infinite alternate linear !important;
}

@keyframes heroBgZoom {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(1.08);
  }
}

.lavida-hero-overlay {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(25, 14, 6, 0.55) 0%, rgba(10, 5, 2, 0.72) 100%) !important;
  /* Light transparent overlay */
  z-index: 1;
}

.lavida-hero-glow {
  position: absolute !important;
  top: 20%;
  left: 30%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(200, 160, 98, 0.25) 0%, transparent 65%);
  pointer-events: none;
  z-index: 1;
  animation: pulseGlow 8s infinite alternate ease-in-out;
}

@keyframes pulseGlow {
  0% {
    transform: scale(0.9);
    opacity: 0.7;
  }

  100% {
    transform: scale(1.15);
    opacity: 1;
  }
}

.lavida-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(200, 160, 98, 0.22);
  border: 1px solid var(--caramel-color);
  padding: 6px 18px;
  border-radius: 50px;
  color: var(--caramel-color);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.hero-title {
  font-size: 3.8rem !important;
  line-height: 1.12 !important;
  color: var(--latte-color) !important;
  font-weight: 800 !important;
  text-shadow: 0 4px 25px rgba(0, 0, 0, 0.85) !important;
}

.hero-subtitle {
  font-size: 1.18rem !important;
  line-height: 1.7 !important;
  color: #F3E9D6 !important;
  max-width: 580px;
  opacity: 1 !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8) !important;
}

.hero-features-row .hero-feature-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--latte-color);
  font-weight: 600;
  font-size: 0.95rem;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
}

.hero-visual-card {
  position: relative;
  display: inline-block;
}

.hero-visual-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200, 160, 98, 0.45) 0%, transparent 70%);
  z-index: 1;
}

.hero-plate-frame {
  position: relative;
  z-index: 2;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  padding: 12px;
  background: var(--bg-secondary);
  border: 2.5px solid var(--caramel-color);
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

.hero-plate-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover !important;
}

.hero-floating-pill {
  position: absolute;
  z-index: 3;
  background: var(--bg-card);
  backdrop-filter: blur(16px);
  border: 1px solid var(--caramel-color);
  padding: 10px 20px;
  border-radius: 50px;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 0.85rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  white-space: nowrap;
}

.hero-floating-pill.pill-top {
  top: 20px;
  right: -20px;
  animation: floatSubtle 4s ease-in-out infinite alternate;
}

.hero-floating-pill.pill-bottom {
  bottom: 20px;
  left: -20px;
  animation: floatSubtle 4s ease-in-out 2s infinite alternate;
}

@keyframes floatSubtle {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-12px);
  }
}

.animate-float {
  animation: floatCard 6s ease-in-out infinite alternate;
}

@keyframes floatCard {
  0% {
    transform: translateY(0) rotate(0deg);
  }

  100% {
    transform: translateY(-15px) rotate(2deg);
  }
}

/* Keyframe entrance animations */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-slide-down {
  animation: slideDown 0.8s ease forwards;
}

.animate-fade-in-up {
  animation: fadeInUp 0.8s ease forwards;
}

/* Responsive Hero */
@media (max-width: 991px) {
  .hero-title {
    font-size: 2.75rem !important;
  }

  .hero-plate-frame {
    width: 280px;
    height: 280px;
    margin: 0 auto;
  }

  .hero-floating-pill.pill-top {
    right: 0;
  }

  .hero-floating-pill.pill-bottom {
    left: 0;
  }
}

/* =========================================================
   LA VIDA LUXURY GLASSMORPHISM AUTH CARDS (LOGIN & REGISTER)
   ========================================================= */

.login_page {
  background: var(--bg-main) !important;
  /* Primary Dark Mocha Theme Background */
  min-height: 90vh;
  display: flex;
  align-items: center;
  padding: 120px 0 80px !important;
  /* Prevents overlap under floating header */
  position: relative;
  overflow: hidden;
}

.login_page::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1000px;
  height: 600px;
  background: radial-gradient(circle, rgba(200, 160, 98, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

.lavida-auth-card {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  background: var(--bg-card) !important;
  border-radius: 28px !important;
  border: 1.5px solid var(--border-color) !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5) !important;
  overflow: hidden !important;
  transition: var(--transition-smooth) !important;
  position: relative;
  z-index: 2;
}

.lavida-auth-card:hover {
  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.6) !important;
  border-color: var(--caramel-color) !important;
}

/* Wide 55% Form Side for comfortable input width */
.auth-form-side {
  flex: 0 0 55% !important;
  max-width: 55% !important;
  padding: 50px 48px !important;
  background: var(--bg-card) !important;
}

/* 45% Banner Side */
.auth-banner-side {
  flex: 0 0 45% !important;
  max-width: 45% !important;
  background: var(--bg-secondary) !important;
  padding: 60px 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: hidden !important;
}

.auth-form-side .subtitle {
  color: var(--paragraph-color) !important;
  opacity: 0.85;
}

.auth-banner-side::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(200, 160, 98, 0.15) 0%, transparent 60%);
  animation: rotateGlow 20s linear infinite;
}

@keyframes rotateGlow {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.auth-banner-content {
  position: relative;
  z-index: 2;
}

.lavida-badge {
  display: inline-block;
  padding: 4px 14px;
  background: var(--latte-color);
  border: 1px solid var(--caramel-color);
  border-radius: 20px;
  color: var(--secondary-color);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.lavida-badge-gold {
  display: inline-block;
  padding: 6px 18px;
  background: rgba(200, 160, 98, 0.2);
  border: 1px solid var(--caramel-color);
  border-radius: 20px;
  color: var(--caramel-color);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Modern Input Groups with Icons */
.lavida-input-group {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

.lavida-input-group .input-icon {
  position: absolute !important;
  left: 18px !important;
  color: var(--caramel-color) !important;
  font-size: 16px !important;
  z-index: 5 !important;
  transition: var(--transition-fast) !important;
  pointer-events: none !important;
}

.lavida-input-group .lavida-input {
  width: 100% !important;
  padding: 14px 18px 14px 48px !important;
  height: 52px !important;
  background: var(--bg-secondary) !important;
  border: 1.5px solid var(--border-color) !important;
  border-radius: 14px !important;
  font-size: 0.95rem !important;
  color: var(--heading-color) !important;
  transition: var(--transition-fast) !important;
}

.lavida-input-group .lavida-input::placeholder {
  color: var(--text-muted) !important;
  opacity: 0.7;
}

.lavida-input-group .lavida-input:focus {
  background: var(--bg-main) !important;
  border-color: var(--caramel-color) !important;
  box-shadow: 0 0 0 4px rgba(193, 230, 180, 0.2) !important;
  outline: none !important;
  transform: translateY(-1px) !important;
}

.lavida-input-group .lavida-input:focus+.input-icon,
.lavida-input-group:focus-within .input-icon {
  color: var(--caramel-color) !important;
  transform: scale(1.1) !important;
}

.forgot-link {
  color: var(--caramel-color) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: var(--transition-fast);
}

.forgot-link:hover {
  color: var(--heading-color) !important;
  text-decoration: underline !important;
}

.auth-seperator {
  position: relative;
  text-align: center;
}

.auth-seperator::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--border-color);
  z-index: 1;
}

.auth-seperator span {
  position: relative;
  z-index: 2;
  background: var(--bg-card);
  padding: 0 16px;
  color: var(--heading-color);
  font-size: 0.85rem;
  font-weight: 600;
}

/* Modern Animated Social Login Buttons */
.btn-social {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  height: 48px !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  transition: var(--transition-smooth) !important;
  cursor: pointer !important;
}

.btn-social.btn-facebook {
  background: rgba(24, 119, 242, 0.08) !important;
  border: 1.5px solid rgba(24, 119, 242, 0.3) !important;
  color: #1877F2 !important;
}

.btn-social.btn-facebook:hover {
  background: #1877F2 !important;
  color: #FFFFFF !important;
  border-color: #1877F2 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(24, 119, 242, 0.3) !important;
}

.btn-social.btn-google {
  background: rgba(219, 68, 85, 0.08) !important;
  border: 1.5px solid rgba(219, 68, 85, 0.3) !important;
  color: #DB4437 !important;
}

.btn-social.btn-google:hover {
  background: #DB4437 !important;
  color: #FFFFFF !important;
  border-color: #DB4437 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(219, 68, 85, 0.3) !important;
}

.auth-link-bold {
  color: var(--secondary-color) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: var(--transition-fast);
}

.auth-link-bold:hover {
  color: var(--caramel-color) !important;
  text-decoration: underline !important;
}

/* RTL Layout Compatibility for Auth Cards */
.arabic-lang .auth-form-side {
  text-align: right !important;
}

.arabic-lang .lavida-input-group .input-icon {
  left: auto !important;
  right: 18px !important;
}

.arabic-lang .lavida-input-group .lavida-input {
  padding: 14px 48px 14px 18px !important;
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .lavida-auth-card {
    flex-direction: column-reverse !important;
  }

  .auth-form-side,
  .auth-banner-side {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 36px 24px !important;
  }
}

/* =========================================================
   LA VIDA LUXURY GALLERY & CULINARY MOMENTS SECTION
   ========================================================= */

.lavida-gallery-section {
  background: var(--bg-secondary) !important;
  padding: 100px 0 !important;
  position: relative;
  border-top: 1px solid rgba(200, 160, 98, 0.25);
}

.btn-gallery-nav {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: rgba(200, 160, 98, 0.18) !important;
  border: 1.5px solid rgba(200, 160, 98, 0.45) !important;
  color: var(--latte-color) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  transition: var(--transition-fast) !important;
  cursor: pointer !important;
}

.btn-gallery-nav:hover {
  background: var(--caramel-color) !important;
  color: #FFFFFF !important;
  border-color: var(--caramel-color) !important;
  transform: scale(1.08) !important;
  box-shadow: 0 6px 20px rgba(200, 160, 98, 0.35) !important;
}

.lavida-gallery-card {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  border: 1.5px solid rgba(123, 167, 114, 0.35);
  box-shadow: 0 15px 40px rgba(123, 167, 114, 0.15);
  transition: var(--transition-smooth);
  background: var(--bg-card);
}

.lavida-gallery-card:hover {
  transform: translateY(-8px) scale(1.02);
  border-color: var(--caramel-color);
  box-shadow: 0 25px 60px rgba(123, 167, 114, 0.25);
}

.gallery-img-wrapper {
  position: relative;
  width: 100%;
  padding-top: 75%;
  /* 4:3 Aspect Ratio */
  overflow: hidden;
  background: var(--bg-main);
}

.gallery-img-wrapper .gallery-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.lavida-gallery-card:hover .gallery-img {
  transform: scale(1.1);
}

/* Glassmorphism Dark Mocha Overlay */
.gallery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(35, 22, 11, 0.2) 0%, rgba(20, 11, 4, 0.88) 100%);
  opacity: 0;
  transition: var(--transition-smooth);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.lavida-gallery-card:hover .gallery-overlay {
  opacity: 1;
}

.gallery-icon-badge {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--caramel-color);
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  align-self: flex-end;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
  transform: scale(0.8) rotate(-10deg);
  transition: var(--transition-smooth);
}

.lavida-gallery-card:hover .gallery-icon-badge {
  transform: scale(1) rotate(0deg);
}

.gallery-caption {
  transform: translateY(15px);
  transition: var(--transition-smooth);
}

.lavida-gallery-card:hover .gallery-caption {
  transform: translateY(0);
}

.gallery-tag {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--caramel-color);
  text-transform: uppercase;
  display: block;
  margin-bottom: 4px;
}

.gallery-title {
  color: #FFFFFF;
  font-family: var(--font-serif);
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0;
}

/* =========================================================
   PAGE SPECIFIC LAYOUT ADJUSTMENTS (ONLINE ORDER MENU PAGE)
   ========================================================= */

.menu_page {
  background-color: var(--light-latte) !important;
}

.subheader {
  padding-top: 130px !important;
  padding-bottom: 70px !important;
  margin-top: 0 !important;
  position: relative !important;
}

.ct-menu-categories,
.menu-filter {
  background: rgba(243, 233, 214, 0.5) !important;
  border: 1px solid rgba(200, 160, 98, 0.3) !important;
  border-radius: var(--border-radius-lg) !important;
  padding: 30px !important;
  box-shadow: var(--shadow-soft) !important;
}

/* Buttons System */
.btn-custom {
  font-family: var(--font-sans) !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  padding: 14px 32px !important;
  border-radius: var(--border-radius-pill) !important;
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  transition: var(--transition-smooth) !important;
  cursor: pointer;
  text-decoration: none !important;
  border: 2px solid transparent !important;
  box-shadow: var(--shadow-soft);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.btn-custom::before {
  background-color: var(--caramel-color) !important;
}

.btn-custom.primary,
.btn-custom:not(.secondary) {
  background: linear-gradient(135deg, var(--secondary-color) 0%, var(--dark-mocha) 100%) !important;
  color: var(--latte-color) !important;
  border-color: var(--caramel-color) !important;
}

.btn-custom.primary:hover,
.btn-custom:not(.secondary):hover {
  background: linear-gradient(135deg, var(--caramel-color) 0%, #B28A4E 100%) !important;
  color: #FFFFFF !important;
  transform: translateY(-3px) scale(1.02);
  box-shadow: var(--shadow-gold) !important;
}

.btn-custom-gold {
  background: linear-gradient(135deg, var(--caramel-color) 0%, #B28A4E 100%) !important;
  color: #FFFFFF !important;
  border: none !important;
}

.btn-custom-gold:hover {
  background: linear-gradient(135deg, var(--secondary-color) 0%, var(--dark-mocha) 100%) !important;
  color: var(--latte-color) !important;
  transform: translateY(-3px);
  box-shadow: var(--shadow-hover);
}

.btn-custom-outline {
  background: transparent !important;
  border: 2px solid var(--caramel-color) !important;
  color: var(--secondary-color) !important;
}

.btn-custom-outline:hover {
  background: var(--caramel-color) !important;
  color: #FFFFFF !important;
  transform: translateY(-3px);
}

/* Sections & Cards */
.section {
  padding: 90px 0;
  position: relative;
}

.section-title-wrap {
  margin-bottom: 50px;
}

.section-title-wrap .title {
  font-size: 3rem;
  color: var(--heading-color);
  margin-top: 5px;
}

/* Feature Cards (Why Choose Us) */
.lavida-feature-card {
  background: var(--cream-white);
  padding: 40px 30px;
  border-radius: var(--border-radius-lg);
  border: 1px solid rgba(200, 160, 98, 0.2);
  box-shadow: var(--shadow-soft);
  text-align: center;
  transition: var(--transition-smooth);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.lavida-feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--caramel-color), var(--primary-color));
  opacity: 0;
  transition: var(--transition-fast);
}

.lavida-feature-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-hover);
  border-color: var(--caramel-color);
}

.lavida-feature-card:hover::before {
  opacity: 1;
}

.lavida-feature-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: var(--latte-color);
  border: 2px solid var(--caramel-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  color: var(--secondary-color);
  margin-bottom: 24px;
  transition: var(--transition-fast);
}

.lavida-feature-card:hover .lavida-feature-icon {
  background: var(--secondary-color);
  color: var(--latte-color);
  transform: rotate(6deg) scale(1.1);
}

/* Menu Section & Cards */
.ct-mini-menu-item {
  background: var(--cream-white);
  border-radius: var(--border-radius-md);
  padding: 24px;
  margin-bottom: 24px;
  border: 1px solid rgba(200, 160, 98, 0.2);
  box-shadow: var(--shadow-soft);
  transition: var(--transition-smooth);
  position: relative;
}

.ct-mini-menu-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: var(--caramel-color);
}

.ct-mini-menu-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 10px;
  border-bottom: 1px dashed rgba(200, 160, 98, 0.3);
  margin-bottom: 12px;
}

.ct-mini-menu-top h5 {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--heading-color);
  margin: 0;
}

.ct-mini-menu-top .price_sec {
  font-family: var(--font-sans);
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--secondary-color);
  background: var(--latte-color);
  padding: 4px 14px;
  border-radius: var(--border-radius-pill);
  border: 1px solid var(--caramel-color);
}

/* Footer Section */
.ct-footer.footer-dark {
  background: var(--bg-secondary) !important;
  color: var(--paragraph-color) !important;
  padding-top: 80px;
  border-top: 4px solid var(--caramel-color);
  position: relative;
}

.footer-widget h5.widget-title {
  color: var(--heading-color) !important;
  font-family: var(--font-serif) !important;
  font-size: 1.5rem !important;
  margin-bottom: 24px;
  position: relative;
  padding-bottom: 10px;
}

.footer-widget h5.widget-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 40px;
  height: 2px;
  background: var(--caramel-color);
}

.footer-widget p {
  color: #D9C9B8 !important;
  font-size: 0.95rem;
}

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

.footer-widget ul li {
  margin-bottom: 12px;
}

.footer-widget ul li a {
  color: #D9C9B8 !important;
  text-decoration: none !important;
  font-size: 0.95rem;
  transition: var(--transition-fast);
  display: inline-block;
}

.footer-widget ul li a:hover {
  color: var(--caramel-color) !important;
  transform: translateX(5px);
}

.social-links {
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.social-links li {
  display: inline-block;
}

/* â”€â”€ NUCLEAR FIX: strip the base footer '>' arrow completely â”€â”€ */
/* The base CSS .footer-widget ul li a::before adds a FontAwesome chevron-right.
   Even hidden (opacity:0), it still takes space inside the flex link, pushing the icon off-center.
   We need higher specificity + content:none to truly erase it. */
.footer-widget .social-links li a::before,
.footer-widget .social-links li a:hover::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  font-size: 0 !important;
}

/* â”€â”€ LINK CIRCLE â”€â”€ */
.footer-widget .social-links li a {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  border-radius: 50% !important;
  background: rgba(200, 160, 98, 0.15) !important;
  border: 1.5px solid rgba(200, 160, 98, 0.45) !important;
  /* TRUE centering â€” flex with explicit axes */
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  /* Reset all inherited transforms from base footer widget */
  transform: translateX(0) translateY(0) !important;
  transition: background 0.28s ease, border-color 0.28s ease,
    transform 0.28s ease, box-shadow 0.28s ease !important;
  text-decoration: none !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}

/* â”€â”€ ICON â”€â”€ */
.footer-widget .social-links li a i,
.footer-widget .social-links li a i.fab,
.footer-widget .social-links li a i.fas {
  font-size: 15px !important;
  color: var(--caramel-color) !important;
  line-height: 1 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  position: static !important;
  transform: none !important;
  transition: color 0.28s ease !important;
}

/* â”€â”€ HOVER â”€â”€ */
.footer-widget .social-links li a:hover {
  background: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  transform: translateX(0) translateY(-4px) !important;
  box-shadow: 0 8px 22px rgba(200, 160, 98, 0.45) !important;
}

.footer-widget .social-links li a:hover i,
.footer-widget .social-links li a:hover i.fab,
.footer-widget .social-links li a:hover i.fas {
  color: #ffffff !important;
}



.footer-bottom {
  border-top: 1px solid rgba(200, 160, 98, 0.2);
  padding: 24px 0;
  margin-top: 60px;
}

.footer-copyright p {
  color: #B5A493 !important;
  font-size: 0.9rem;
  margin: 0;
}

/* Animations */
@keyframes lavidaFadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-up {
  animation: lavidaFadeUp 0.8s ease forwards;
}

/* Cart Sidebar modern drawer styling */
.cart-sidebar {
  background: var(--cream-white) !important;
  border-left: 2px solid var(--caramel-color);
}

/* Preloader */
.ct-preloader {
  background: var(--bg-main) !important;
}

.lds-ripple div {
  border: 4px solid var(--caramel-color) !important;
}

/* =========================================================
   LA VIDA LUXURY HERO SECTION & GALLERY CAROUSEL FIXES
   ========================================================= */

.lavida-hero-section {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  padding-top: 130px;
  padding-bottom: 80px;
  background: var(--bg-main);
  overflow: hidden;
}

.lavida-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: brightness(0.95) contrast(1.05);
  z-index: 1;
}

.lavida-hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg-secondary);
  z-index: 2;
}

.lavida-hero-glow {
  position: absolute;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(123, 167, 114, 0.25) 0%, rgba(0, 0, 0, 0) 70%);
  top: 15%;
  right: 10%;
  pointer-events: none;
  z-index: 2;
}

.hero-title {
  font-size: 3.5rem !important;
  font-weight: 700;
  color: var(--heading-color) !important;
  line-height: 1.15;
}

.hero-subtitle {
  font-size: 1.1rem;
  color: var(--paragraph-color);
  max-width: 580px;
  line-height: 1.7;
}

.hero-visual-card {
  position: relative;
  display: inline-block;
  margin: 0 auto;
}

.hero-plate-frame {
  width: 360px;
  height: 360px;
  border-radius: 50%;
  border: 4px solid var(--caramel-color);
  box-shadow: 0 20px 50px rgba(123, 167, 114, 0.2);
  overflow: hidden;
  position: relative;
  background: var(--bg-card);
  margin: 0 auto;
}

.hero-plate-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50%;
  display: block !important;
}

.hero-floating-pill {
  position: absolute;
  background: var(--bg-card-glass);
  border: 1px solid var(--caramel-color);
  color: var(--heading-color);
  padding: 8px 18px;
  border-radius: 50px;
  font-size: 0.85rem;
  font-weight: 600;
  box-shadow: 0 10px 25px rgba(123, 167, 114, 0.2);
  white-space: nowrap;
  backdrop-filter: blur(10px);
  z-index: 5;
}

.hero-floating-pill.pill-top {
  top: 10px;
  right: -15px;
}

.hero-floating-pill.pill-bottom {
  bottom: 20px;
  left: -15px;
}

.hero-feature-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--paragraph-color);
  font-size: 0.92rem;
  font-weight: 600;
}

/* Gallery Carousel Explicit Height & Layout */
#blog_carousel .item,
#blog_carousel .blog-col {
  padding: 8px;
  width: 100%;
  display: block;
}

.lavida-gallery-card {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: 1.5px solid rgba(123, 167, 114, 0.35);
  box-shadow: 0 15px 40px rgba(123, 167, 114, 0.15);
  transition: var(--transition-smooth);
  background: var(--bg-card);
  width: 100%;
  display: block;
}

.gallery-img-wrapper {
  position: relative;
  width: 100%;
  height: 280px;
  overflow: hidden;
  background: var(--bg-main);
  display: block;
}

.gallery-img-wrapper .gallery-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  position: absolute;
  top: 0;
  left: 0;
}

/* =========================================================
   MOBILE ASIDE DRAWER â€” LA VIDA
   ========================================================= */

.lavida-mobile-aside {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 300px !important;
  max-width: 85vw !important;
  height: 100vh !important;
  background: #180E06 !important;
  border-right: 2px solid var(--caramel-color) !important;
  z-index: 9999 !important;
  transform: translateX(-110%) !important;
  /* Always fully off-screen */
  visibility: hidden !important;
  /* Also hide from accessibility */
  pointer-events: none !important;
  /* Prevent clicks when hidden */
  transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0.38s !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--caramel-color) transparent !important;
}

.lavida-mobile-aside.open {
  transform: translateX(0) !important;
  visibility: visible !important;
  pointer-events: all !important;
}

/* Header area: logo + close */
.lavida-aside-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 20px 20px 16px !important;
  border-bottom: 1px solid rgba(200, 160, 98, 0.25) !important;
  flex-shrink: 0 !important;
}

.lavida-aside-logo {
  max-height: 40px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Close X button */
.lavida-aside-close {
  background: rgba(200, 160, 98, 0.15) !important;
  border: 1px solid rgba(200, 160, 98, 0.4) !important;
  color: var(--caramel-color) !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 0.95rem !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.lavida-aside-close:hover {
  background: var(--caramel-color) !important;
  color: #fff !important;
}

/* Nav section wrapper */
.lavida-aside-nav {
  padding: 14px 16px 8px !important;
}

/* Section label */
.lavida-aside-section-label {
  font-family: var(--font-sans) !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  color: rgba(200, 160, 98, 0.55) !important;
  text-transform: uppercase !important;
  margin: 0 0 8px 4px !important;
}

/* Link list */
.lavida-aside-links {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

/* Individual link */
.lavida-aside-link {
  display: flex !important;
  align-items: center !important;
  padding: 11px 14px !important;
  border-radius: 10px !important;
  font-family: var(--font-sans) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: rgba(240, 220, 190, 0.85) !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  border: 1px solid transparent !important;
}

.lavida-aside-link i {
  color: var(--caramel-color) !important;
  font-size: 0.9rem !important;
  width: 20px !important;
  text-align: center !important;
}

.lavida-aside-link:hover,
.lavida-aside-link.active {
  background: rgba(200, 160, 98, 0.18) !important;
  color: var(--caramel-color) !important;
  border-color: rgba(200, 160, 98, 0.35) !important;
}

/* Divider between sections */
.lavida-aside-divider {
  height: 1px !important;
  background: rgba(200, 160, 98, 0.2) !important;
  margin: 4px 16px !important;
}

/* Cart badge inside aside */
.lavida-aside-cart-badge {
  background: var(--caramel-color) !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  min-width: 22px !important;
  height: 22px !important;
  border-radius: 50px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 6px !important;
}

/* Custom Scrollbar for Cart Sidebar */
.cart-sidebar-scroll::-webkit-scrollbar {
  width: 5px !important;
}

.cart-sidebar-scroll::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.2) !important;
  border-radius: 10px !important;
}

.cart-sidebar-scroll::-webkit-scrollbar-thumb {
  background: rgba(200, 160, 98, 0.4) !important;
  border-radius: 10px !important;
}

.cart-sidebar-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(200, 160, 98, 0.7) !important;
}

/* Sidebar Cart High-Contrast Text Rules */
.cart-sidebar {
  width: 390px !important;
  max-width: 90vw !important;
  background: #FAF6F0 !important;
  color: #1E140C !important;
}

.cart-sidebar .order_summary h4,
.cart-sidebar .order_summary span,
.cart-sidebar .order_summary strong,
.cart-sidebar .order_summary_inner *,
.cart-sidebar .order_summary .total * {
  color: #1E140C !important;
}

.cart-sidebar .order_summary_inner span {
  color: #4A3B32 !important;
  font-weight: 700 !important;
}

.cart-sidebar .order_summary .cart-total {
  color: #8B5E28 !important;
  font-weight: 800 !important;
}

.sidebar-cart-card {
  background: #F2EADF !important;
  border: 1.5px solid #D8C3A5 !important;
}

.sidebar-cart-card .card-title {
  color: #1E140C !important;
  font-weight: 700 !important;
}

.sidebar-cart-card .subtotal_cal {
  color: #8B5E28 !important;
  font-weight: 800 !important;
}

/* Exact Match for Reference Images 3 & 4 Cart Item Cards */
.ref-cart-item-card {
  background: #FFFFFF !important;
  border: 1.5px solid #EAE3D9 !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.25s ease !important;
  position: relative !important;
}

.ref-cart-item-card:hover {
  border-color: #C8A062 !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06) !important;
}

.ref-cart-img-box {
  width: 75px !important;
  height: 75px !important;
  min-width: 75px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #F8F5F0 !important;
  border: 1px solid #EAE3D9 !important;
  flex-shrink: 0 !important;
}

.ref-cart-img-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.ref-cart-title {
  color: #1A2536 !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  line-height: 1.3 !important;
}

.ref-cart-meta {
  color: #667085 !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
}

.ref-cart-note {
  color: #667085 !important;
  font-size: 0.82rem !important;
}

.ref-cart-footer {
  border-top: 1px solid #F0EAE1 !important;
}

.ref-cart-price {
  color: #1A2536 !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Outline Capsule Quantity Control (Images 3 & 4 style) */
.ref-qty-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.ref-qty-btn {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50px !important;
  border: 1.5px solid #1A2536 !important;
  background: #FFFFFF !important;
  color: #1A2536 !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  line-height: 1 !important;
  padding: 0 !important;
}

.ref-qty-btn:hover {
  background: #1A2536 !important;
  color: #FFFFFF !important;
}

.ref-qty-pill .cart_qty {
  width: 24px !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  color: #1A2536 !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

.ref-cart-remove-btn {
  background: transparent !important;
  border: none !important;
  color: #98A2B3 !important;
  font-size: 1rem !important;
  cursor: pointer !important;
  padding: 2px 6px !important;
  transition: all 0.2s ease !important;
  line-height: 1 !important;
}

.ref-cart-remove-btn:hover {
  color: #D92D20 !important;
  transform: scale(1.2) !important;
}

/* Product Page Button Hover Effects (Matching Image 5) */
.product-action-bar button.single_order:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 30px rgba(200, 160, 98, 0.5) !important;
}

.product-action-bar .go_to_checkout:hover {
  background: rgba(200, 160, 98, 0.2) !important;
  border-color: #C8A062 !important;
  color: #FFFFFF !important;
}

/* ================================================================
   CART SIDEBAR â€” Premium Dark Coffee Redesign
   ================================================================ */

/* â”€â”€ Panel shell â”€â”€ */
.cs-panel {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  width: 360px !important;
  max-width: 96vw !important;
  height: 100dvh !important;
  background: var(--bg-card) !important;
  border-left: 1px solid rgba(200, 160, 98, 0.2) !important;
  box-shadow: -20px 0 60px rgba(0, 0, 0, 0.7) !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 9999 !important;
  font-family: var(--font-sans) !important;
  transform: translateX(100%) !important;
  transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cart-sidebar-wrapper.open .cs-panel,
.cart-sidebar-wrapper.active .cs-panel,
body.cart-open .cs-panel {
  transform: translateX(0) !important;
}

/* â”€â”€ Header â”€â”€ */
.cs-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 18px 20px !important;
  border-bottom: 1px solid rgba(200, 160, 98, 0.15) !important;
  background: var(--bg-secondary) !important;
  flex-shrink: 0 !important;
}

.cs-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.cs-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: rgba(200, 160, 98, 0.12) !important;
  border: 1px solid rgba(200, 160, 98, 0.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #C8A062 !important;
  font-size: 0.85rem !important;
}

.cs-title {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #F4EAD3 !important;
  letter-spacing: 0.02em !important;
}

.cs-count {
  background: rgba(200, 160, 98, 0.18) !important;
  border: 1px solid rgba(200, 160, 98, 0.35) !important;
  color: #C8A062 !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  min-width: 22px !important;
  text-align: center !important;
}

.cs-close-btn {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  border: 1.5px solid rgba(200, 160, 98, 0.25) !important;
  background: transparent !important;
  color: #8A7060 !important;
  font-size: 0.9rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s !important;
}

.cs-close-btn:hover {
  border-color: rgba(200, 160, 98, 0.6) !important;
  color: #F4EAD3 !important;
  background: rgba(200, 160, 98, 0.08) !important;
  transform: rotate(90deg) !important;
}

/* â”€â”€ Scrollable items area (shows ~2-3 items, then scrolls) â”€â”€ */
.cs-items-wrap {
  flex: 1 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(200, 160, 98, 0.2) transparent !important;
}

.cs-items-wrap::-webkit-scrollbar {
  width: 4px !important;
}

.cs-items-wrap::-webkit-scrollbar-track {
  background: transparent !important;
}

.cs-items-wrap::-webkit-scrollbar-thumb {
  background: rgba(200, 160, 98, 0.25) !important;
  border-radius: 4px !important;
}

/* â”€â”€ Cart Item Card (horizontal compact) â”€â”€ */
#order_html_render .sidebar-cart-card,
#order_html_render .ref-cart-item-card,
.cs-items-wrap .sidebar-cart-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  background: var(--bg-card) !important;
  border: 1px solid rgba(200, 160, 98, 0.12) !important;
  border-radius: 14px !important;
  padding: 12px !important;
  margin: 0 !important;
  position: relative !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.25s, box-shadow 0.25s !important;
  flex-shrink: 0 !important;
}

#order_html_render .sidebar-cart-card:hover,
.cs-items-wrap .sidebar-cart-card:hover {
  border-color: rgba(200, 160, 98, 0.3) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

/* Thumbnail */
#order_html_render img,
#order_html_render .ref-cart-img-box img {
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  max-height: 64px !important;
  object-fit: cover !important;
  border-radius: 10px !important;
  display: block !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(200, 160, 98, 0.15) !important;
}

#order_html_render .ref-cart-img-box {
  flex-shrink: 0 !important;
  width: 64px !important;
  height: 64px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Content area */
#order_html_render .flex-grow-1 {
  flex: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

/* Item title */
#order_html_render .ref-cart-title {
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: #F4EAD3 !important;
  font-family: var(--font-sans) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: calc(100% - 28px) !important;
  line-height: 1.3 !important;
  margin: 0 !important;
}

/* Modifiers */
#order_html_render .ref-cart-meta li,
#order_html_render .modifier_div {
  font-size: 0.72rem !important;
  color: #7A6A5A !important;
  line-height: 1.5 !important;
}

/* Note */
#order_html_render .ref-cart-note {
  font-size: 0.72rem !important;
  color: #7A6A5A !important;
  font-style: italic !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Footer row: price + qty pill */
#order_html_render .ref-cart-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 2px !important;
  padding-top: 0 !important;
  border-top: none !important;
}

/* Price */
#order_html_render .ref-cart-price,
#order_html_render .subtotal_cal {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #C8A062 !important;
  line-height: 1 !important;
  background: none !important;
  padding: 0 !important;
  border: none !important;
}

/* Qty pill */
#order_html_render .ref-qty-pill {
  display: flex !important;
  align-items: center !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(200, 160, 98, 0.25) !important;
  border-radius: 30px !important;
  padding: 3px 4px !important;
  gap: 4px !important;
}

#order_html_render .ref-qty-btn,
#order_html_render .minus_cart,
#order_html_render .plus_cart {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  border: none !important;
  background: transparent !important;
  color: #C8A062 !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.18s, transform 0.15s !important;
  line-height: 1 !important;
  padding: 0 !important;
}

#order_html_render .ref-qty-btn:hover,
#order_html_render .minus_cart:hover,
#order_html_render .plus_cart:hover {
  background: rgba(200, 160, 98, 0.18) !important;
  transform: scale(1.12) !important;
}

#order_html_render .ref-qty-btn:active,
#order_html_render .minus_cart:active,
#order_html_render .plus_cart:active {
  transform: scale(0.9) !important;
}

#order_html_render .ref-qty-val {
  min-width: 28px !important;
  text-align: center !important;
}

#order_html_render .cart_qty,
#order_html_render .ref-qty-val input {
  width: 28px !important;
  text-align: center !important;
  background: transparent !important;
  border: none !important;
  color: #F4EAD3 !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  outline: none !important;
  font-family: var(--font-sans) !important;
}

/* Delete button */
#order_html_render .delete-btn,
#order_html_render .single-item-remove,
#order_html_render .ref-cart-remove-btn {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  border: none !important;
  background: rgba(217, 45, 32, 0.08) !important;
  color: #7A6A5A !important;
  font-size: 0.68rem !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s !important;
  padding: 0 !important;
}

#order_html_render .delete-btn:hover,
#order_html_render .single-item-remove:hover,
#order_html_render .ref-cart-remove-btn:hover {
  background: rgba(217, 45, 32, 0.18) !important;
  color: #F04438 !important;
  transform: scale(1.15) !important;
}

/* â”€â”€ Footer: summary + checkout â”€â”€ */
.cs-footer {
  border-top: 1px solid rgba(200, 160, 98, 0.12) !important;
  padding: 16px 16px 20px !important;
  background: var(--bg-secondary) !important;
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

/* Summary */
.cs-summary {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}

.cs-summary-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.cs-summary-row span {
  font-size: 0.82rem !important;
  color: #6A5848 !important;
  font-weight: 500 !important;
}

.cs-summary-row strong {
  font-size: 0.85rem !important;
  color: #D4C4B0 !important;
  font-weight: 700 !important;
}

.cs-summary-divider {
  height: 1px !important;
  background: linear-gradient(90deg, rgba(200, 160, 98, 0.18), transparent) !important;
  margin: 4px 0 !important;
}

.cs-summary-total {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 2px !important;
}

.cs-summary-total span {
  font-size: 0.82rem !important;
  color: #9A8070 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.cs-summary-total strong {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: #C8A062 !important;
}

/* Checkout button */
.cs-checkout-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  height: 52px !important;
  background: linear-gradient(135deg, #C8A062 0%, #A67C38 100%) !important;
  border: none !important;
  border-radius: 50px !important;
  color: #0E0905 !important;
  font-family: var(--font-sans) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 8px 24px rgba(200, 160, 98, 0.3) !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

.cs-checkout-btn::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent) !important;
  transition: left 0.5s !important;
}

.cs-checkout-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 35px rgba(200, 160, 98, 0.45) !important;
  color: #0E0905 !important;
}

.cs-checkout-btn:hover::before {
  left: 100% !important;
}

.cs-checkout-btn:active {
  transform: translateY(1px) !important;
}

/* Overlay backdrop */
.cart-sidebar-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(8, 5, 2, 0.6) !important;
  backdrop-filter: blur(4px) !important;
  z-index: 9998 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.35s ease !important;
}

.cart-sidebar-wrapper.open .cart-sidebar-overlay,
.cart-sidebar-wrapper.active .cart-sidebar-overlay,
body.cart-open .cart-sidebar-overlay {
  opacity: 1 !important;
  pointer-events: all !important;
}

/* Keep old .cart-sidebar class working for any JS that targets it */
.cart-sidebar {
  display: contents !important;
}

/* =========================================================
   THEME TOGGLE BUTTON STYLES (DESKTOP CAPSULE & MOBILE ASIDE)
   ========================================================= */

body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-item {
  width: auto !important;
  height: 38px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: rgba(200, 160, 98, 0.18) !important;
  border: 1px solid rgba(200, 160, 98, 0.45) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  outline: none !important;
}

body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover {
  background: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  transform: translateY(-2px) rotate(20deg) !important;
  box-shadow: 0 4px 14px rgba(200, 160, 98, 0.35) !important;
}

body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover i {
  color: #FFFFFF !important;
}

/* Sun and Moon Icon visibility per theme */
[data-theme="dark"] .theme-icon-sun,
:root:not([data-theme="light"]) .theme-icon-sun {
  display: inline-block !important;
  color: #F1C40F !important;
  font-size: 15px !important;
}

[data-theme="dark"] .theme-icon-moon,
:root:not([data-theme="light"]) .theme-icon-moon {
  display: none !important;
}

[data-theme="light"] .theme-icon-sun {
  display: none !important;
}

[data-theme="light"] .theme-icon-moon {
  display: inline-block !important;
  color: #6B421D !important;
  font-size: 15px !important;
}

/* Mobile Theme Badge in Aside Drawer */
.theme-mobile-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: rgba(200, 160, 98, 0.2) !important;
  border: 1px solid rgba(200, 160, 98, 0.4) !important;
  padding: 3px 12px !important;
  border-radius: 20px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: var(--caramel-color) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

/* =========================================================
   LIGHT THEME DESIGN OVERRIDES
   Identity colors: LATTE #F3E9D6, MOCHA #6B421D, STONE #D9D3CA
   ========================================================= */

[data-theme="light"],
body.light-theme {
  background-color: #FAF6F0 !important;
  color: #3D2614 !important;
}

/* Navbar in Light Mode */
[data-theme="light"] body header.main-header.lavida-floating-header,
body.light-theme header.main-header.lavida-floating-header {
  background: rgba(255, 253, 249, 0.94) !important;
  border-color: rgba(107, 66, 29, 0.22) !important;
  box-shadow: 0 10px 30px rgba(107, 66, 29, 0.08) !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header.scrolled,
body.light-theme header.main-header.lavida-floating-header.scrolled {
  background: rgba(250, 246, 240, 0.98) !important;
  border-color: var(--caramel-color) !important;
  box-shadow: 0 14px 40px rgba(107, 66, 29, 0.12) !important;
}

/* Navbar in Light Mode */
[data-theme="light"] body header.main-header.lavida-floating-header .navbar-nav .menu-item a,
body.light-theme header.main-header.lavida-floating-header .navbar-nav .menu-item a {
  color: #2C1A0E !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .navbar-nav .menu-item a:hover,
[data-theme="light"] body header.main-header.lavida-floating-header .navbar-nav .menu-item a.active,
body.light-theme header.main-header.lavida-floating-header .navbar-nav .menu-item a:hover,
body.light-theme header.main-header.lavida-floating-header .navbar-nav .menu-item a.active {
  color: #FFFFFF !important;
  background-color: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  box-shadow: 0 4px 14px rgba(200, 160, 98, 0.35) !important;
}

/* Navbar Controls (Cart, Language, Login, Theme) in Light Mode */
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner>li,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner>li,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .cart-trigger,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children {
  background: rgba(200, 160, 98, 0.16) !important;
  border-color: rgba(107, 66, 29, 0.24) !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner span,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner a,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner span,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner a {
  color: #2C1A0E !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner i,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner i {
  color: #6B421D !important;
}

/* Navbar Controls Hover in Light Mode (Deep Mocha with White Text & Gold Icon) */
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner>li:hover,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner>li:hover,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover {
  background: #6B421D !important;
  border-color: #6B421D !important;
  box-shadow: 0 4px 16px rgba(107, 66, 29, 0.28) !important;
  transform: translateY(-2px) !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner>li:hover>span,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover>span:not(.cart-item-count),
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>span,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>a,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner>li:hover>span,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover>span:not(.cart-item-count),
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>span,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>a {
  color: #FFFFFF !important;
}

/* Cart Badge Number on Hover in Light Mode */
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover .cart-item-count,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover .cart-item-count {
  background: #FFFFFF !important;
  color: #6B421D !important;
  font-weight: 900 !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner>li:hover>i,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover>i,
[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>i,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner>li:hover>i,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .cart-trigger:hover>i,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .menu-item-has-children:hover>i {
  color: #F3E9D6 !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn {
  background: rgba(200, 160, 98, 0.16) !important;
  border-color: rgba(107, 66, 29, 0.22) !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover {
  background: #6B421D !important;
  border-color: #6B421D !important;
}

[data-theme="light"] body header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover i,
body.light-theme header.main-header.lavida-floating-header .header-controls-inner .theme-toggle-btn:hover i {
  color: #F3E9D6 !important;
}

/* Dropdown Submenu in Light Mode */
[data-theme="light"] .navbar-nav .submenu,
[data-theme="light"] .header-controls-inner .submenu,
body.light-theme .navbar-nav .submenu,
body.light-theme .header-controls-inner .submenu {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.18) !important;
  box-shadow: 0 16px 40px rgba(107, 66, 29, 0.15) !important;
  padding: 8px !important;
}

[data-theme="light"] .submenu .menu-item,
body.light-theme .submenu .menu-item {
  background: transparent !important;
  border: none !important;
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  display: block !important;
  width: 100% !important;
}

[data-theme="light"] .submenu .menu-item a,
body.light-theme .submenu .menu-item a {
  color: #2C1A0E !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  padding: 10px 16px !important;
  display: block !important;
  width: 100% !important;
  border-radius: 8px !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

[data-theme="light"] .submenu .menu-item a:hover,
body.light-theme .submenu .menu-item a:hover {
  background: var(--caramel-color, #C8A062) !important;
  color: #FFFFFF !important;
  border-color: var(--caramel-color, #C8A062) !important;
}

/* Mobile Aside in Light Mode */
[data-theme="light"] .lavida-mobile-aside,
body.light-theme .lavida-mobile-aside {
  background: #FAF6F0 !important;
  border-right: 1.5px solid rgba(107, 66, 29, 0.18) !important;
}

[data-theme="light"] .lavida-aside-link,
body.light-theme .lavida-aside-link {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-aside-section-label,
body.light-theme .lavida-aside-section-label {
  color: #6B421D !important;
}

[data-theme="light"] .lavida-aside-divider,
body.light-theme .lavida-aside-divider {
  background: rgba(107, 66, 29, 0.12) !important;
}

/* Standard Section in Light Mode */
[data-theme="light"] .lavida-standard-section,
body.light-theme .lavida-standard-section {
  background: linear-gradient(160deg, #FAF6F0 0%, #F3E9D6 50%, #FAF6F0 100%) !important;
}

[data-theme="light"] .lavida-standard-title,
body.light-theme .lavida-standard-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-standard-sub,
[data-theme="light"] .sec-sub-title,
[data-theme="light"] .hero-subtitle,
[data-theme="light"] .subtitle,
[data-theme="light"] .section-subtitle,
body.light-theme .lavida-standard-sub,
body.light-theme .sec-sub-title,
body.light-theme .hero-subtitle,
body.light-theme .subtitle,
body.light-theme .section-subtitle {
  color: #6B421D !important;
  /* Rich Darker Mocha */
  font-weight: 700 !important;
}

/* Auth Cards in Light Mode */
[data-theme="light"] .lavida-auth-card,
[data-theme="light"] .auth-form-side,
body.light-theme .lavida-auth-card,
body.light-theme .auth-form-side {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.18) !important;
}

[data-theme="light"] .lavida-input-group .lavida-input,
body.light-theme .lavida-input-group .lavida-input {
  background: #FAF6F0 !important;
  border-color: rgba(107, 66, 29, 0.22) !important;
  color: #2C1A0E !important;
}

[data-theme="light"] .auth-seperator span,
body.light-theme .auth-seperator span {
  background: #FFFFFF !important;
  color: #6B421D !important;
}

[data-theme="light"] .lavida-std-card,
body.light-theme .lavida-std-card {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.12) !important;
  box-shadow: 0 10px 30px rgba(107, 66, 29, 0.07) !important;
}

[data-theme="light"] .lavida-std-card:hover,
body.light-theme .lavida-std-card:hover {
  border-color: var(--caramel-color) !important;
  box-shadow: 0 18px 40px rgba(107, 66, 29, 0.14) !important;
}

[data-theme="light"] .lavida-std-title,
body.light-theme .lavida-std-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-std-desc,
body.light-theme .lavida-std-desc {
  color: #4A3324 !important;
}

/* 3D Menu Carousel in Light Mode */
[data-theme="light"] .lavida-3d-menu-section,
body.light-theme .lavida-3d-menu-section {
  background: #F3E9D6 !important;
}

[data-theme="light"] .lavida-3d-menu-section .title,
body.light-theme .lavida-3d-menu-section .title {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-3d-menu-section .subtitle,
body.light-theme .lavida-3d-menu-section .subtitle {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] .lavida-3d-card-inner,
body.light-theme .lavida-3d-card-inner {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.16) !important;
  box-shadow: 0 18px 45px rgba(107, 66, 29, 0.1) !important;
}

[data-theme="light"] .lavida-3d-card.is-active .lavida-3d-card-inner,
body.light-theme .lavida-3d-card.is-active .lavida-3d-card-inner {
  background: #FFFFFF !important;
  border-color: var(--caramel-color) !important;
  box-shadow: 0 25px 65px rgba(107, 66, 29, 0.18), 0 0 35px rgba(200, 160, 98, 0.25) !important;
}

[data-theme="light"] .lavida-3d-card-title,
[data-theme="light"] .lavida-3d-card-title a,
body.light-theme .lavida-3d-card-title,
body.light-theme .lavida-3d-card-title a {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-3d-sub-tag,
body.light-theme .lavida-3d-sub-tag {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] .lavida-3d-card-desc,
body.light-theme .lavida-3d-card-desc {
  color: #4A3324 !important;
}

[data-theme="light"] .lavida-3d-price-tag .price-val,
body.light-theme .lavida-3d-price-tag .price-val {
  color: #6B421D !important;
}

[data-theme="light"] .lavida-3d-arrow,
body.light-theme .lavida-3d-arrow {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
  color: #2C1A0E !important;
  box-shadow: 0 6px 20px rgba(107, 66, 29, 0.1) !important;
}

[data-theme="light"] .lavida-3d-dot,
body.light-theme .lavida-3d-dot {
  background: rgba(107, 66, 29, 0.25) !important;
}

[data-theme="light"] .lavida-3d-dot.is-active,
body.light-theme .lavida-3d-dot.is-active {
  background: var(--caramel-color) !important;
}

/* Gallery Section in Light Mode */
[data-theme="light"] .lavida-gallery-section,
body.light-theme .lavida-gallery-section {
  background: #FAF6F0 !important;
}

[data-theme="light"] .lavida-gallery-section h2,
body.light-theme .lavida-gallery-section h2 {
  color: #2C1A0E !important;
}

[data-theme="light"] .lavida-gallery-section p.text-latte,
body.light-theme .lavida-gallery-section p.text-latte {
  color: #4A3324 !important;
}

[data-theme="light"] .btn-gallery-nav,
body.light-theme .btn-gallery-nav {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
  color: #2C1A0E !important;
}

/* Menu Catalog Page in Light Mode */
[data-theme="light"] .mp-menu-page,
[data-theme="light"] .mp-page,
body.light-theme .mp-menu-page,
body.light-theme .mp-page {
  background-color: #FAF6F0 !important;
}

[data-theme="light"] .mp-search-input,
body.light-theme .mp-search-input {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
  color: #2C1A0E !important;
}

[data-theme="light"] .mp-cat-pill,
[data-theme="light"] .mp-cat-btn,
body.light-theme .mp-cat-pill,
body.light-theme .mp-cat-btn {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.18) !important;
  color: #2C1A0E !important;
  box-shadow: 0 4px 14px rgba(107, 66, 29, 0.05) !important;
}

[data-theme="light"] .mp-cat-pill.active,
[data-theme="light"] .mp-cat-pill:hover,
[data-theme="light"] .mp-cat-btn.active,
[data-theme="light"] .mp-cat-btn:hover,
body.light-theme .mp-cat-pill.active,
body.light-theme .mp-cat-pill:hover,
body.light-theme .mp-cat-btn.active,
body.light-theme .mp-cat-btn:hover {
  background: var(--caramel-color) !important;
  border-color: var(--caramel-color) !important;
  color: #FFFFFF !important;
}

[data-theme="light"] .mp-card,
body.light-theme .mp-card {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.14) !important;
  box-shadow: 0 10px 28px rgba(107, 66, 29, 0.07) !important;
}

[data-theme="light"] .mp-card-title,
[data-theme="light"] .mp-card-title a,
[data-theme="light"] .mp-card-title-link,
[data-theme="light"] .mp-card-name,
body.light-theme .mp-card-title,
body.light-theme .mp-card-title a,
body.light-theme .mp-card-title-link,
body.light-theme .mp-card-name {
  color: #2C1A0E !important;
}

[data-theme="light"] .mp-card-title a:hover,
[data-theme="light"] .mp-card-title-link:hover,
body.light-theme .mp-card-title a:hover,
body.light-theme .mp-card-title-link:hover {
  color: var(--caramel-color) !important;
}

[data-theme="light"] .mp-card-desc,
body.light-theme .mp-card-desc {
  color: #4A3324 !important;
}

[data-theme="light"] .mp-card-price,
body.light-theme .mp-card-price {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] .mp-card-rating-num,
body.light-theme .mp-card-rating-num {
  color: #5C4A3E !important;
}

/* Product Detail Page in Light Mode */
[data-theme="light"] .pd-page-wrap,
[data-theme="light"] .pd-page,
body.light-theme .pd-page-wrap,
body.light-theme .pd-page {
  background-color: #FAF6F0 !important;
}

[data-theme="light"] .pd-card-container,
body.light-theme .pd-card-container {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.16) !important;
  box-shadow: 0 20px 50px rgba(107, 66, 29, 0.08) !important;
}

[data-theme="light"] .pd-title,
[data-theme="light"] .pd-item-title,
body.light-theme .pd-title,
body.light-theme .pd-item-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .pd-category,
body.light-theme .pd-category {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] .pd-desc,
[data-theme="light"] .pd-item-desc,
body.light-theme .pd-desc,
body.light-theme .pd-item-desc {
  color: #4A3324 !important;
}

[data-theme="light"] .pd-price-main,
[data-theme="light"] .pd-price-val,
body.light-theme .pd-price-main,
body.light-theme .pd-price-val {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] .pd-price-label,
body.light-theme .pd-price-label {
  color: #5C4A3E !important;
}

[data-theme="light"] .pd-modifiers-title,
body.light-theme .pd-modifiers-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .pd-mod-item,
body.light-theme .pd-mod-item {
  background: #F8F4EE !important;
  border-color: rgba(107, 66, 29, 0.15) !important;
  color: #2C1A0E !important;
}

[data-theme="light"] .pd-mod-item-name,
body.light-theme .pd-mod-item-name {
  color: #2C1A0E !important;
}

[data-theme="light"] .pd-mod-price,
body.light-theme .pd-mod-price {
  color: #6B421D !important;
}

[data-theme="light"] .pd-mod-item:hover,
[data-theme="light"] .pd-mod-item.selected,
body.light-theme .pd-mod-item:hover,
body.light-theme .pd-mod-item.selected {
  background: #FFFFFF !important;
  border-color: var(--caramel-color) !important;
}

[data-theme="light"] .pd-qty-stepper,
[data-theme="light"] .pd-qty-box,
body.light-theme .pd-qty-stepper,
body.light-theme .pd-qty-box {
  background: #F8F4EE !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
}

[data-theme="light"] .pd-qty-input,
body.light-theme .pd-qty-input {
  color: #2C1A0E !important;
}

[data-theme="light"] .pd-note-input,
body.light-theme .pd-note-input {
  background: #F8F4EE !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
  color: #2C1A0E !important;
}

/* Cart Drawer Sidebar in Light Mode */
[data-theme="light"] .cs-panel,
body.light-theme .cs-panel {
  background: #FAF6F0 !important;
  border-left: 1.5px solid rgba(107, 66, 29, 0.18) !important;
  box-shadow: -15px 0 50px rgba(107, 66, 29, 0.15) !important;
}

[data-theme="light"] .cs-header,
body.light-theme .cs-header {
  background: #F3E9D6 !important;
  border-bottom: 1px solid rgba(107, 66, 29, 0.14) !important;
}

[data-theme="light"] .cs-title,
body.light-theme .cs-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .cs-icon,
body.light-theme .cs-icon {
  background: rgba(200, 160, 98, 0.22) !important;
  border-color: rgba(107, 66, 29, 0.25) !important;
  color: #6B421D !important;
}

[data-theme="light"] .cs-count,
body.light-theme .cs-count {
  background: rgba(200, 160, 98, 0.25) !important;
  border-color: rgba(107, 66, 29, 0.3) !important;
  color: #6B421D !important;
}

[data-theme="light"] .cs-close-btn,
body.light-theme .cs-close-btn {
  background: #FFFFFF !important;
  border-color: rgba(107, 66, 29, 0.2) !important;
  color: #6B421D !important;
}

[data-theme="light"] .cs-close-btn:hover,
body.light-theme .cs-close-btn:hover {
  background: var(--caramel-color) !important;
  color: #FFFFFF !important;
  border-color: var(--caramel-color) !important;
}

[data-theme="light"] .cs-items-wrap,
body.light-theme .cs-items-wrap {
  background: #FAF6F0 !important;
}

[data-theme="light"] #order_html_render .sidebar-cart-card,
[data-theme="light"] #order_html_render .ref-cart-item-card,
[data-theme="light"] .cs-items-wrap .sidebar-cart-card,
body.light-theme #order_html_render .sidebar-cart-card,
body.light-theme #order_html_render .ref-cart-item-card,
body.light-theme .cs-items-wrap .sidebar-cart-card {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.14) !important;
  box-shadow: 0 4px 15px rgba(107, 66, 29, 0.05) !important;
}

[data-theme="light"] #order_html_render .ref-cart-title,
[data-theme="light"] .sidebar-cart-card .card-title,
body.light-theme #order_html_render .ref-cart-title,
body.light-theme .sidebar-cart-card .card-title {
  color: #2C1A0E !important;
}

[data-theme="light"] #order_html_render .ref-cart-price,
body.light-theme #order_html_render .ref-cart-price {
  color: #6B421D !important;
  font-weight: 700 !important;
}

[data-theme="light"] #order_html_render .ref-cart-meta,
[data-theme="light"] #order_html_render .modifier_div,
body.light-theme #order_html_render .ref-cart-meta,
body.light-theme #order_html_render .modifier_div {
  color: #5C4A3E !important;
}

[data-theme="light"] #order_html_render .ref-cart-note,
body.light-theme #order_html_render .ref-cart-note {
  color: #6B421D !important;
}

[data-theme="light"] #order_html_render .ref-cart-remove-btn,
body.light-theme #order_html_render .ref-cart-remove-btn {
  background: rgba(107, 66, 29, 0.08) !important;
  border-color: rgba(107, 66, 29, 0.18) !important;
  color: #6B421D !important;
}

[data-theme="light"] #order_html_render .ref-cart-remove-btn:hover,
body.light-theme #order_html_render .ref-cart-remove-btn:hover {
  background: #e74c3c !important;
  color: #FFFFFF !important;
  border-color: #e74c3c !important;
}

[data-theme="light"] #order_html_render .ref-qty-pill,
body.light-theme #order_html_render .ref-qty-pill {
  background: #F3E9D6 !important;
  border-color: rgba(107, 66, 29, 0.22) !important;
}

[data-theme="light"] #order_html_render .ref-qty-btn,
body.light-theme #order_html_render .ref-qty-btn {
  color: #2C1A0E !important;
}

[data-theme="light"] #order_html_render .ref-qty-btn:hover,
body.light-theme #order_html_render .ref-qty-btn:hover {
  background: var(--caramel-color) !important;
  color: #FFFFFF !important;
}

[data-theme="light"] #order_html_render .ref-qty-val input,
[data-theme="light"] #order_html_render .cart_qty,
body.light-theme #order_html_render .ref-qty-val input,
body.light-theme #order_html_render .cart_qty {
  color: #2C1A0E !important;
  background: transparent !important;
}

[data-theme="light"] .cs-footer,
body.light-theme .cs-footer {
  background: #F3E9D6 !important;
  border-top: 1px solid rgba(107, 66, 29, 0.16) !important;
}

[data-theme="light"] .cs-summary-row,
body.light-theme .cs-summary-row {
  color: #5C4A3E !important;
}

[data-theme="light"] .cs-summary-row strong,
body.light-theme .cs-summary-row strong {
  color: #2C1A0E !important;
}

[data-theme="light"] .cs-summary-divider,
body.light-theme .cs-summary-divider {
  background: rgba(107, 66, 29, 0.16) !important;
}

[data-theme="light"] .cs-summary-total,
body.light-theme .cs-summary-total {
  color: #2C1A0E !important;
}

[data-theme="light"] .cs-summary-total strong,
body.light-theme .cs-summary-total strong {
  color: #6B421D !important;
}

[data-theme="light"] .cs-checkout-btn,
body.light-theme .cs-checkout-btn {
  background: linear-gradient(135deg, #C8A062 0%, #A67C38 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 20px rgba(107, 66, 29, 0.22) !important;
}

[data-theme="light"] .cs-checkout-btn:hover,
body.light-theme .cs-checkout-btn:hover {
  background: linear-gradient(135deg, #A67C38 0%, #6B421D 100%) !important;
  color: #FFFFFF !important;
}

/* Auth Cards in Light Mode */
[data-theme="light"] .login_page,
body.light-theme .login_page {
  background: linear-gradient(135deg, #FAF6F0 0%, #F3E9D6 100%) !important;
}

[data-theme="light"] .mp-page,
body.light-theme .mp-page {
  background: #FAF6F0 !important;
  color: #3D2614 !important;
}

[data-theme="light"] .mp-hero,
body.light-theme .mp-hero {
  background: radial-gradient(ellipse at 50% 0%, rgba(200, 160, 98, 0.18) 0%, rgba(250, 246, 240, 0.98) 75%) !important;
  border-bottom: 1px solid rgba(107, 66, 29, 0.14) !important;
}

[data-theme="light"] .mp-hero-title,
body.light-theme .mp-hero-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .mp-hero-sub,
body.light-theme .mp-hero-sub {
  color: #5C4A3E !important;
}

[data-theme="light"] .pd-page,
body.light-theme .pd-page {
  background: #FAF6F0 !important;
  color: #3D2614 !important;
}

[data-theme="light"] .pd-breadcrumb,
body.light-theme .pd-breadcrumb {
  background: linear-gradient(180deg, rgba(243, 233, 214, 0.95) 0%, rgba(250, 246, 240, 0) 100%) !important;
}

[data-theme="light"] .pd-breadcrumb .current,
body.light-theme .pd-breadcrumb .current {
  color: #6B421D !important;
}

[data-theme="light"] .pd-image-panel,
body.light-theme .pd-image-panel {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.16) !important;
  box-shadow: 0 25px 60px rgba(107, 66, 29, 0.1) !important;
}

[data-theme="light"] .about-us,
[data-theme="light"] .contact-page,
[data-theme="light"] .reservation-page,
[data-theme="light"] .checkout_page,
body.light-theme .about-us,
body.light-theme .contact-page,
body.light-theme .reservation-page,
body.light-theme .checkout_page {
  background-color: #FAF6F0 !important;
  color: #3D2614 !important;
}

[data-theme="light"] .contact-form,
[data-theme="light"] .reservation-form,
[data-theme="light"] .checkout-wrapper,
[data-theme="light"] .cart-totals-area,
body.light-theme .contact-form,
body.light-theme .reservation-form,
body.light-theme .checkout-wrapper,
body.light-theme .cart-totals-area {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.14) !important;
  box-shadow: 0 15px 40px rgba(107, 66, 29, 0.08) !important;
  color: #3D2614 !important;
}

[data-theme="light"] input.form-control,
[data-theme="light"] textarea.form-control,
[data-theme="light"] select.form-control,
body.light-theme input.form-control,
body.light-theme textarea.form-control,
body.light-theme select.form-control {
  background: #FFFFFF !important;
  border: 1px solid rgba(107, 66, 29, 0.22) !important;
  color: #2C1A0E !important;
}

[data-theme="light"] .footer-area,
body.light-theme .footer-area {
  background: var(--bg-secondary) !important;
  /* Life Green Footer */
  color: var(--paragraph-color) !important;
}

/* =========================================================
   TOP PAGE SUBHEADER BANNER (About Us, Reservation, Contact, Checkout)
   ========================================================= */

.lavida-page-subheader {
  position: relative !important;
  padding: 125px 0 65px !important;
  text-align: center !important;
  overflow: hidden !important;
  transition: all 0.35s ease !important;
}

/* Dark Mode Subheader (Default) */
[data-theme="dark"] .lavida-page-subheader,
:root:not([data-theme="light"]) .lavida-page-subheader,
body.dark-theme .lavida-page-subheader {
  background: var(--bg-secondary) !important;
  border-bottom: 3px solid var(--caramel-color) !important;
}

[data-theme="dark"] .lavida-page-subheader .title,
:root:not([data-theme="light"]) .lavida-page-subheader .title,
body.dark-theme .lavida-page-subheader .title {
  color: var(--latte-color) !important;
  font-size: 3rem !important;
  font-weight: 700 !important;
  margin-top: 10px !important;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.8) !important;
}

[data-theme="dark"] .lavida-page-subheader .sub-heading-tag,
:root:not([data-theme="light"]) .lavida-page-subheader .sub-heading-tag,
body.dark-theme .lavida-page-subheader .sub-heading-tag {
  color: var(--caramel-color) !important;
  background: rgba(200, 160, 98, 0.15) !important;
  padding: 6px 18px !important;
  border-radius: 30px !important;
  border: 1px solid var(--caramel-color) !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.15em !important;
  display: inline-block !important;
}

/* Light Mode Subheader (Warm Cream / Latte with Crisp Espresso Mocha typography) */
[data-theme="light"] .lavida-page-subheader,
body.light-theme .lavida-page-subheader {
  background: radial-gradient(ellipse at 50% 0%, rgba(200, 160, 98, 0.22) 0%, rgba(243, 233, 214, 0.65) 50%, #FAF6F0 100%) !important;
  border-bottom: 2px solid rgba(107, 66, 29, 0.18) !important;
  box-shadow: 0 10px 30px rgba(107, 66, 29, 0.05) !important;
}

[data-theme="light"] .lavida-page-subheader .title,
body.light-theme .lavida-page-subheader .title {
  color: #2C1A0E !important;
  font-size: 3rem !important;
  font-weight: 700 !important;
  margin-top: 10px !important;
  text-shadow: none !important;
}

[data-theme="light"] .lavida-page-subheader .sub-heading-tag,
body.light-theme .lavida-page-subheader .sub-heading-tag {
  color: #6B421D !important;
  background: rgba(200, 160, 98, 0.22) !important;
  padding: 6px 18px !important;
  border-radius: 30px !important;
  border: 1px solid rgba(107, 66, 29, 0.28) !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.15em !important;
  display: inline-block !important;
  font-weight: 700 !important;
}

/* Order Online (mp-hero) Light Mode Subheader */
[data-theme="light"] .mp-hero,
body.light-theme .mp-hero {
  background: radial-gradient(ellipse at 50% 0%, rgba(200, 160, 98, 0.24) 0%, rgba(243, 233, 214, 0.7) 60%, #FAF6F0 100%) !important;
  border-bottom: 2px solid rgba(107, 66, 29, 0.16) !important;
}

[data-theme="light"] .mp-hero-tag,
body.light-theme .mp-hero-tag {
  background: rgba(200, 160, 98, 0.22) !important;
  border-color: rgba(107, 66, 29, 0.28) !important;
  color: #6B421D !important;
}

[data-theme="light"] .mp-hero-title,
body.light-theme .mp-hero-title {
  color: #2C1A0E !important;
}

[data-theme="light"] .mp-hero-sub,
body.light-theme .mp-hero-sub {
  color: #5C4A3E !important;
}