/* ==========================================================================
   LUXOTEL UNIFIED LUXURY DESIGN SYSTEM — CORE STYLESHEET
   Inspired by: Red Sea, Aqaba Beach, Coral, Clear Water, Mountains,
   Wadi Rum Desert, Sandstone, Sunlight, Warm Natural Textures & Resort Hospitality
   ========================================================================== */

@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=Montserrat:wght@300;400;500;600;700;800&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Tajawal:wght@400;500;700;800&display=swap');

:root {
  /* Canvas & Warm Sandstone Textures */
  --lux-bg-canvas:     #FAF7F2;  /* Soft Warm Sunlight Canvas */
  --lux-bg-sand:       #F4EFE6;  /* Light Sandstone / Warm Ivory */
  --lux-bg-card:       #FFFDF9;  /* Crisp Warm Card Surface */
  --lux-sand-border:   #E8DCCD;  /* Subtle Desert Sand Border */
  --lux-sand-soft:     #F9F6F0;  /* Secondary Panel Fill */
  --lux-sand-hover:    #F0E8DC;

  /* Red Sea & Deep Waters */
  --lux-navy-950:      #081422;  /* Deepest Abyss */
  --lux-navy-900:      #0B1E33;  /* Deep Red Sea Midnight */
  --lux-navy-800:      #0D1B2A;  /* Primary Luxury Navy */
  --lux-navy-700:      #102B48;  /* Elevated Navy Surface */
  --lux-navy-600:      #183D63;  /* Active Navy Button */
  --lux-aqua-500:      #1E6A7A;  /* Red Sea Clear Turquoise Water */
  --lux-aqua-400:      #2D8C9E;  /* Bright Coral Reef Water */
  --lux-aqua-soft:     #EBF3F7;  /* Sea Mist Water Tint */

  /* Sunlit Gold & Warm Coral Accents */
  --lux-gold-600:      #A57223;  /* Deep Antique Gold */
  --lux-gold-500:      #BD872F;  /* Warm Jordanian Sun Gold */
  --lux-gold-400:      #D4AF37;  /* Light Gold Highlight */
  --lux-gold-300:      #E5BE6E;  /* Shimmer Gold */
  --lux-gold-soft:     #F6EEDF;  /* Subtle Gold Tint for Badges */
  --lux-coral-500:     #D96B43;  /* Red Sea Coral Accent */
  --lux-coral-soft:    #FCEEE8;  /* Soft Coral Tag Fill */

  /* Editorial Ink & Muted Typographic Tones */
  --lux-ink-900:       #12202E;  /* Editorial Body Ink */
  --lux-ink-700:       #364555;  /* Secondary Heading Ink */
  --lux-ink-600:       #5D6C7B;  /* Refined Description Slate */
  --lux-ink-400:       #8E9CA8;  /* Subtitle & Microcopy */
  --lux-ink-300:       #B8C3CC;  /* Disabled / Border Soft */

  /* Typography Stacks */
  --lux-font-display:  'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --lux-font-serif:    'Cormorant Garamond', Georgia, serif;
  --lux-font-sans:     'Montserrat', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --lux-font-arabic:   'Tajawal', 'Almarai', -apple-system, BlinkMacSystemFont, 'Segoe UI', Tahoma, sans-serif;

  /* Elevation, Radius & Shadows */
  --lux-radius-xs:     6px;
  --lux-radius-sm:     10px;
  --lux-radius-md:     16px;
  --lux-radius-lg:     24px;
  --lux-radius-xl:     32px;
  --lux-radius-pill:   999px;

  --lux-shadow-subtle: 0 4px 20px rgba(13, 27, 42, 0.05);
  --lux-shadow-card:   0 10px 30px rgba(13, 27, 42, 0.07);
  --lux-shadow-hover:  0 20px 48px rgba(13, 27, 42, 0.13);
  --lux-shadow-modal:  0 30px 80px rgba(8, 20, 34, 0.35);

  /* Layout Widths & Metrics */
  --lux-max-width:     1280px;
  --lux-nav-height:    76px;
  --lux-mobile-dock-h: 64px;

  /* Shared foundation aliases for future guest-facing surfaces. */
  --lux-space-1: 4px;
  --lux-space-2: 8px;
  --lux-space-3: 12px;
  --lux-space-4: 16px;
  --lux-space-5: 24px;
  --lux-space-6: 32px;
  --lux-space-7: 48px;
  --lux-border-subtle: 1px solid var(--lux-sand-border);
  --lux-border-dark: 1px solid rgba(255, 255, 255, 0.2);
  --lux-image-radius: var(--lux-radius-lg);
  --lux-breakpoint-mobile: 768px;
  --lux-breakpoint-tablet: 1024px;

  /* Transitions */
  --lux-transition:    all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  --lux-transition-slow: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================
   RESET & BASE CONFIGURATION
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  background-color: var(--lux-bg-canvas);
  color: var(--lux-ink-900);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  min-height: 100vh;
  min-height: 100svh;
  font-family: var(--lux-font-sans);
  background-color: var(--lux-bg-canvas);
  color: var(--lux-ink-900);
  line-height: 1.6;
  overflow-x: hidden;
}

html[dir="rtl"] body {
  font-family: var(--lux-font-arabic);
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: var(--lux-transition);
}

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
  background: transparent;
  border: none;
  outline: none;
}

button {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* Screen Reader Only Utility */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ==========================================================================
   CONTAINERS & STRUCTURAL GRIDS
   ========================================================================== */
.lux-container {
  width: min(var(--lux-max-width), calc(100% - 48px));
  margin-inline: auto;
  min-width: 0;
}

@media (max-width: 768px) {
  .lux-container {
    width: min(var(--lux-max-width), calc(100% - 32px));
  }
}

/* ==========================================================================
   TOPBAR NAVIGATION (DESKTOP & MOBILE)
   ========================================================================== */
.lux-topbar {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  height: var(--lux-nav-height);
  background: rgba(250, 247, 242, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 0;
  transition: var(--lux-transition);
}

.lux-topbar-inner {
  direction: ltr;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.lux-brand-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}

.lux-brand-logo {
  height: 46px;
  width: auto;
  object-fit: contain;
}

.lux-nav-links {
  display: flex;
  align-items: center;
  gap: clamp(14px, 2vw, 30px);
  list-style: none;
}

.lux-nav-link {
  font-family: var(--lux-font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lux-navy-800);
  padding: 6px 0;
  position: relative;
  transition: var(--lux-transition);
}

.lux-nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--lux-gold-500);
  transition: var(--lux-transition);
}

.lux-nav-link:hover,
.lux-nav-link.active {
  color: var(--lux-gold-500);
}

.lux-nav-link:hover::after,
.lux-nav-link.active::after {
  width: 100%;
}

.lux-topbar-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

/* Language Toggle */
.lux-lang-selector {
  display: flex;
  align-items: center;
}

.lux-lang-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-pill);
  background: var(--lux-bg-card);
  color: var(--lux-navy-800);
  font-family: inherit;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.03em;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none;
  transition: var(--lux-transition);
}

.lux-lang-btn:hover {
  border-color: var(--lux-gold-500);
  color: var(--lux-gold-500);
}
/* Mobile Nav Toggle */
.lux-nav-toggle {
  display: none;
  width: 42px;
  height: 42px;
  border-radius: var(--lux-radius-sm);
  border: 1px solid var(--lux-sand-border);
  background: var(--lux-bg-card);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
}

.lux-nav-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--lux-navy-800);
  border-radius: 2px;
  transition: var(--lux-transition);
}

@media (max-width: 1024px) {
  .lux-nav-links {
    display: none;
  }
  .lux-nav-toggle {
    display: flex;
  }
}

/* Mobile Navigation Drawer */
.lux-mobile-drawer {
  position: fixed;
  inset: 0;
  background: rgba(11, 30, 51, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 150;
  opacity: 0;
  pointer-events: none;
  transition: var(--lux-transition);
}

.lux-mobile-drawer.open {
  opacity: 1;
  pointer-events: auto;
}

.lux-drawer-panel {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: min(340px, 86vw);
  background: var(--lux-bg-canvas);
  box-shadow: -10px 0 40px rgba(0, 0, 0, 0.2);
  padding: 30px 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

html[dir="rtl"] .lux-drawer-panel {
  right: auto;
  left: 0;
  transform: translateX(-100%);
}

.lux-mobile-drawer.open .lux-drawer-panel {
  transform: translateX(0);
}

.lux-drawer-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: none;
  margin-top: 24px;
}

.lux-drawer-link {
  font-family: var(--lux-font-display);
  font-size: 1.35rem;
  font-weight: 500;
  color: var(--lux-navy-900);
  padding: 10px 14px;
  border-radius: var(--lux-radius-sm);
  display: block;
}

.lux-drawer-link:hover,
.lux-drawer-link.active {
  background: var(--lux-gold-soft);
  color: var(--lux-gold-600);
}

/* ==========================================================================
   BUTTON SYSTEM
   ========================================================================== */
.lux-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 26px;
  font-family: var(--lux-font-sans);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: var(--lux-radius-pill);
  transition: var(--lux-transition);
  text-align: center;
  white-space: nowrap;
}

.lux-btn-gold,
.lux-btn-primary {
  background: var(--lux-gold-500);
  color: #FFFFFF;
  box-shadow: 0 8px 24px rgba(189, 135, 47, 0.28);
  border: 1px solid var(--lux-gold-400);
}

.lux-btn-gold:hover,
.lux-btn-primary:hover {
  background: var(--lux-gold-600);
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(189, 135, 47, 0.38);
  color: #FFFFFF;
}

.lux-btn-navy {
  background: var(--lux-navy-800);
  color: #FFFFFF;
  border: 1px solid var(--lux-navy-700);
  box-shadow: 0 8px 24px rgba(13, 27, 42, 0.2);
}

.lux-btn-navy:hover {
  background: var(--lux-navy-900);
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(13, 27, 42, 0.3);
  color: #FFFFFF;
}

.lux-btn-outline {
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.45);
}

.lux-btn-outline:hover {
  background: rgba(255, 255, 255, 0.25);
  border-color: #FFFFFF;
  transform: translateY(-2px);
  color: #FFFFFF;
}

.lux-btn-outline-dark {
  background: transparent;
  color: var(--lux-navy-800);
  border: 1px solid var(--lux-sand-border);
}

.lux-btn-outline-dark:hover {
  border-color: var(--lux-gold-500);
  color: var(--lux-gold-500);
  background: var(--lux-gold-soft);
}

.lux-btn-circle {
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #FFFFFF;
  transition: var(--lux-transition);
}

.lux-btn-circle:hover {
  background: var(--lux-gold-500);
  border-color: var(--lux-gold-500);
  transform: scale(1.08);
}

/* ==========================================================================
   LUXURY HERO SECTION (PORTAL & PROPERTY)
   ========================================================================== */
.lux-hero {
  position: relative;
  min-height: clamp(520px, 72vh, 760px);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--lux-radius-lg);
  overflow: hidden;
  margin: 18px 0 42px;
  box-shadow: var(--lux-shadow-lg);
  isolation: isolate;
}

.lux-hero-media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.lux-hero-media img,
.lux-hero-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.lux-hero-scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    180deg,
    rgba(8, 20, 34, 0.25) 0%,
    rgba(8, 20, 34, 0.45) 45%,
    rgba(8, 20, 34, 0.88) 100%
  );
}

.lux-hero-content {
  width: 100%;
  max-width: 860px;
  padding: 48px 36px;
  color: #FFFFFF;
  text-align: left;
}

html[dir="rtl"] .lux-hero-content {
  text-align: right;
}

.lux-kicker {
  display: inline-block;
  font-family: var(--lux-font-sans);
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--lux-gold-400);
  margin-bottom: 14px;
}

.lux-hero-title {
  font-family: var(--lux-font-display);
  font-size: clamp(2.4rem, 5.5vw, 4.4rem);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: 0;
  color: #FFFFFF;
  margin-bottom: 14px;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.lux-hero-subtitle {
  font-family: var(--lux-font-sans);
  font-size: clamp(0.95rem, 1.4vw, 1.2rem);
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.88);
  max-width: 620px;
  margin-bottom: 28px;
}

.lux-hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* ==========================================================================
   CHOOSE YOUR WORLD / EXPERIENCE GRID
   ========================================================================== */
.lux-section {
  padding: 36px 0 64px;
}

.lux-section-header {
  text-align: center;
  margin-bottom: 36px;
}

.lux-section-kicker {
  font-family: var(--lux-font-sans);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--lux-gold-500);
  margin-bottom: 8px;
}

.lux-section-title {
  font-family: var(--lux-font-display);
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  font-weight: 500;
  line-height: 1.15;
  color: var(--lux-navy-900);
  letter-spacing: 0;
}

.lux-section-desc {
  font-size: 1rem;
  color: var(--lux-ink-600);
  max-width: 580px;
  margin: 8px auto 0;
}

/* 5-Column Intelligent World Grid (Desktop) / Horizontal Touch Snap (Mobile) */
.lux-world-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
}

@media (max-width: 1100px) {
  .lux-world-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .lux-world-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.lux-world-card {
  position: relative;
  height: clamp(240px, 32vw, 340px);
  border-radius: var(--lux-radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 24px 20px;
  color: #FFFFFF;
  text-decoration: none;
  box-shadow: var(--lux-shadow-card);
  border: 1px solid rgba(232, 220, 205, 0.4);
  background: var(--lux-navy-900);
  isolation: isolate;
  transition: var(--lux-transition);
}

.lux-world-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--lux-shadow-hover);
  border-color: var(--lux-gold-400);
}

.lux-world-media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.lux-world-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.02);
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.lux-world-card:hover .lux-world-media img {
  transform: scale(1.08);
}

.lux-world-scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    180deg,
    rgba(8, 20, 34, 0.05) 0%,
    rgba(8, 20, 34, 0.35) 45%,
    rgba(8, 20, 34, 0.92) 100%
  );
  transition: opacity 0.3s ease;
}

.lux-world-card:hover .lux-world-scrim {
  opacity: 0.95;
}

.lux-world-tag {
  font-family: var(--lux-font-sans);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lux-gold-400);
  margin-bottom: 4px;
}

.lux-world-title {
  font-family: var(--lux-font-display);
  font-size: clamp(1.2rem, 1.8vw, 1.45rem);
  font-weight: 600;
  line-height: 1.15;
  color: #FFFFFF;
  margin-bottom: 4px;
}

.lux-world-subtitle {
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.82);
  font-weight: 400;
  line-height: 1.4;
}

/* ==========================================================================
   OUR DINING — DEDICATED RESTAURANT SELECTION (PHASE 4)
   ========================================================================== */
.lux-dining-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: 32px;
}

@media (max-width: 900px) {
  .lux-dining-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.lux-restaurant-card {
  position: relative;
  height: clamp(320px, 38vw, 440px);
  border-radius: var(--lux-radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 32px 28px;
  color: #FFFFFF;
  text-decoration: none;
  box-shadow: var(--lux-shadow-card);
  border: 1px solid rgba(232, 220, 205, 0.4);
  background: var(--lux-navy-900);
  isolation: isolate;
  transition: var(--lux-transition);
}

.lux-restaurant-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--lux-shadow-hover);
  border-color: var(--lux-gold-400);
}

.lux-restaurant-media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.lux-restaurant-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.02);
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.lux-restaurant-card:hover .lux-restaurant-media img {
  transform: scale(1.07);
}

.lux-restaurant-scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    180deg,
    rgba(8, 20, 34, 0.1) 0%,
    rgba(8, 20, 34, 0.4) 40%,
    rgba(8, 20, 34, 0.94) 100%
  );
}

.lux-restaurant-body {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.lux-restaurant-info {
  flex: 1;
}

.lux-restaurant-tag {
  font-family: var(--lux-font-sans);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lux-gold-400);
  margin-bottom: 6px;
}

.lux-restaurant-name {
  font-family: var(--lux-font-display);
  font-size: clamp(1.4rem, 2.2vw, 1.85rem);
  font-weight: 600;
  line-height: 1.15;
  color: #FFFFFF;
  margin-bottom: 6px;
}

.lux-restaurant-desc {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.45;
}

/* ==========================================================================
   MENU CONTROLS & CATEGORY DOCK (PHASE 5)
   ========================================================================== */
.lux-menu-header {
  text-align: center;
  padding: 36px 0 24px;
}

.lux-menu-toolbar-wrap {
  position: sticky;
  top: var(--lux-nav-height);
  z-index: 90;
  background: rgba(250, 247, 242, 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-block: 1px solid var(--lux-sand-border);
  padding: 12px 0;
  margin-bottom: 32px;
  transition: var(--lux-transition);
}

.lux-menu-toolbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

/* Segmented Food / Beverage Toggle */
.lux-group-segmented {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  background: var(--lux-bg-sand);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-pill);
}

.lux-group-tab {
  padding: 9px 22px;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lux-navy-800);
  border-radius: var(--lux-radius-pill);
  transition: var(--lux-transition);
}

.lux-group-tab.active {
  background: var(--lux-navy-800);
  color: #FFFFFF;
  box-shadow: 0 4px 14px rgba(13, 27, 42, 0.18);
}

/* Horizontal Category Navigation Carousel */
.lux-category-dock {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:4px 0;
  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
}
.lux-category-dock::-webkit-scrollbar { display:none; }

@media (max-width:720px) {
  body > .lux-category-dock.lux-mobile-category-dock {
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:calc(var(--lux-mobile-dock-h) + env(safe-area-inset-bottom, 0px)) !important;
    top:auto !important;
    z-index:110 !important;
    display:flex !important;
    width:100% !important;
    min-height:58px;
    padding:8px 14px !important;
    margin:0 !important;
    gap:9px !important;
    background:rgba(250,247,242,.97) !important;
    border:0 !important;
    border-top:1px solid var(--lux-sand-border) !important;
    border-radius:0 !important;
    box-shadow:0 -5px 20px rgba(13,27,42,.08) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap;
  }
  body > .lux-category-dock.lux-mobile-category-dock .lux-cat-pill {
    flex:0 0 auto !important;
    min-width:max-content;
    min-height:42px;
    padding:9px 18px !important;
    border-radius:999px !important;
    font-size:.82rem !important;
    background:#fff;
  }
  body > .lux-category-dock.lux-mobile-category-dock .lux-cat-pill.active {
    background:var(--lux-navy-800) !important;
    color:#fff !important;
  }
  body:has(> .lux-category-dock.lux-mobile-category-dock:not([hidden])) {
    padding-bottom:calc(var(--lux-mobile-dock-h) + 58px + env(safe-area-inset-bottom,0px));
  }
}

.lux-cat-pill {
  padding: 8px 18px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--lux-ink-700);
  background: var(--lux-bg-card);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-pill);
  white-space: nowrap;
  scroll-snap-align: start;
  transition: var(--lux-transition);
}

.lux-cat-pill:hover {
  border-color: var(--lux-gold-500);
  color: var(--lux-gold-500);
}

.lux-cat-pill.active {
  background: var(--lux-navy-800);
  color: #FFFFFF;
  border-color: var(--lux-navy-800);
  box-shadow: 0 4px 12px rgba(13, 27, 42, 0.14);
}

/* Menu Search Bar */
.lux-menu-search {
  position: relative;
  min-width: 220px;
}

.lux-menu-search input {
  width: 100%;
  padding: 8px 14px 8px 36px;
  font-size: 0.8125rem;
  background: var(--lux-bg-card);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-pill);
  color: var(--lux-navy-800);
  transition: var(--lux-transition);
}

html[dir="rtl"] .lux-menu-search input {
  padding: 8px 36px 8px 14px;
}

.lux-menu-search input:focus {
  border-color: var(--lux-gold-500);
  box-shadow: 0 0 0 3px rgba(189, 135, 47, 0.15);
}

.lux-menu-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--lux-ink-400);
  pointer-events: none;
  font-size: 0.875rem;
}

html[dir="rtl"] .lux-menu-search-icon {
  left: auto;
  right: 12px;
}

/* ==========================================================================
   MENU SECTIONS & ITEM CARDS (EDITORIAL LUXURY DESIGN)
   ========================================================================== */
.lux-menu-section {
  margin-bottom: 48px;
}

.lux-menu-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 36px 0 24px;
  position: relative;
}

.lux-menu-rule {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--lux-sand-border) 40%, var(--lux-gold-500) 100%);
  position: relative;
}

.lux-menu-rule:last-child {
  transform: scaleX(-1);
}

.lux-menu-section-title {
  font-family: var(--lux-font-display);
  font-size: clamp(1.4rem, 2.2vw, 1.85rem);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--lux-navy-900);
  padding: 0 8px;
  text-align: center;
}

/* 2-Column Intelligent Editorial Grid on Desktop, 1-Column on Mobile */
.lux-items-grid,
.items-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 28px;
  list-style: none;
  margin: 0 0 36px;
  padding: 0;
}

@media (max-width: 820px) {
  .lux-items-grid,
  .items-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.lux-item-card,
.menu-item {
  padding: 18px 20px;
  background: var(--lux-bg-card);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-md);
  box-shadow: var(--lux-shadow-subtle);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  transition: var(--lux-transition);
}

.lux-item-card:hover,
.menu-item:hover {
  border-color: var(--lux-gold-400);
  box-shadow: var(--lux-shadow-card);
  transform: translateY(-2px);
}

.lux-item-card.signature,
.menu-item.signature {
  border-left: 3px solid var(--lux-gold-500);
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.04) 0%, var(--lux-bg-card) 60%);
}

html[dir="rtl"] .lux-item-card.signature,
html[dir="rtl"] .menu-item.signature {
  border-left: 1px solid var(--lux-sand-border);
  border-right: 3px solid var(--lux-gold-500);
}

.lux-item-header,
.item-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.item-line h3 {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;
  font-size: 1.125rem;
  font-family: var(--lux-font-display);
  font-weight: 600;
  color: var(--lux-navy-900);
  line-height: 1.25;
}

.item-line h3 em {
  font-family: var(--lux-font-sans);
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-style: normal;
  padding: 2px 7px;
  background: var(--lux-gold-soft);
  color: var(--lux-gold-600);
  border: 1px solid var(--lux-gold-400);
  border-radius: var(--lux-radius-pill);
}

.item-line i {
  flex: 1;
  border-bottom: 1px dashed var(--lux-sand-border);
  margin: 0 4px;
  min-width: 12px;
}

.item-line strong {
  font-family: var(--lux-font-sans);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--lux-gold-600);
  white-space: nowrap;
}

.lux-item-name,
.menu-item-name {
  font-family: var(--lux-font-display);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--lux-navy-900);
  line-height: 1.25;
}

.lux-item-price {
  font-family: var(--lux-font-sans);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--lux-gold-600);
  white-space: nowrap;
}

.lux-item-desc,
.menu-item p {
  font-size: 0.875rem;
  color: var(--lux-ink-600);
  line-height: 1.5;
  margin: 0;
}

.lux-item-meta,
.item-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
}

.lux-meta-chip,
.session-duration,
.nutrition-calories,
.allergen-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--lux-ink-700);
  background: var(--lux-bg-sand);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-pill);
}

.lux-meta-chip.featured {
  background: var(--lux-gold-soft);
  color: var(--lux-gold-600);
  border-color: var(--lux-gold-400);
}

.nutrition-calories,
.lux-meta-chip.calories {
  background: var(--lux-coral-soft);
  color: var(--lux-coral-500);
  border-color: rgba(224, 122, 95, 0.3);
}

.session-duration {
  background: var(--lux-aqua-soft);
  color: var(--lux-aqua-600);
  border-color: rgba(30, 106, 122, 0.25);
}

/* ==========================================================================
   CONTACT, ALLERGEN & FEEDBACK MODALS (PHASE 6)
   ========================================================================== */
.lux-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(8, 20, 34, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: none;
  place-items: center;
  padding: 20px;
}

.lux-modal-backdrop.open {
  display: grid;
}

.lux-modal-card {
  position: relative;
  width: min(540px, 100%);
  max-height: min(720px, 90vh);
  overflow-y: auto;
  background: var(--lux-bg-card);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-lg);
  padding: 36px 32px;
  box-shadow: var(--lux-shadow-modal);
  color: var(--lux-navy-900);
}

.lux-modal-close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.25rem;
  color: var(--lux-ink-600);
  transition: var(--lux-transition);
}

html[dir="rtl"] .lux-modal-close {
  right: auto;
  left: 18px;
}

.lux-modal-close:hover {
  background: var(--lux-bg-sand);
  color: var(--lux-navy-900);
}

.lux-feedback-form {
  display: grid;
  gap: 16px;
  margin-top: 20px;
}

.lux-field {
  display: grid;
  gap: 6px;
}

.lux-field label {
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--lux-navy-800);
}

.lux-field input,
.lux-field select,
.lux-field textarea {
  width: 100%;
  padding: 12px 14px;
  background: var(--lux-bg-sand);
  border: 1px solid var(--lux-sand-border);
  border-radius: var(--lux-radius-sm);
  color: var(--lux-navy-900);
  transition: var(--lux-transition);
}

.lux-field input:focus,
.lux-field select:focus,
.lux-field textarea:focus {
  border-color: var(--lux-gold-500);
  background: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(189, 135, 47, 0.15);
}

/* ==========================================================================
   FLOATING ACTION & SIDEBAR TAB (CONTACT / FEEDBACK)
   ========================================================================== */
.lux-contact-side-tab {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 80;
  background: var(--lux-navy-800);
  color: #FFFFFF;
  border: 1px solid var(--lux-gold-500);
  border-right: none;
  border-radius: var(--lux-radius-sm) 0 0 var(--lux-radius-sm);
  padding: 14px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  box-shadow: -4px 8px 24px rgba(13, 27, 42, 0.2);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  transition: var(--lux-transition);
}

html[dir="rtl"] .lux-contact-side-tab {
  right: auto;
  left: 0;
  border-left: none;
  border-right: 1px solid var(--lux-gold-500);
  border-radius: 0 var(--lux-radius-sm) var(--lux-radius-sm) 0;
}

.lux-contact-side-tab:hover {
  background: var(--lux-gold-500);
  transform: translateY(-50%) translateX(-4px);
}

html[dir="rtl"] .lux-contact-side-tab:hover {
  transform: translateY(-50%) translateX(4px);
}

/* ==========================================================================
   FOOTER SYSTEM & SOCIAL ICONS
   ========================================================================== */
.lux-footer {
  margin-top: 64px;
  padding: 48px 0 36px;
  background: var(--lux-navy-900);
  color: #FFFFFF;
  border-top: 1px solid var(--lux-navy-700);
}

.lux-footer-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 24px;
}

.lux-footer-logo {
  height: 48px;
  width: auto;
  object-fit: contain;
}

.lux-footer-tagline {
  font-family: var(--lux-font-display);
  font-size: 1.25rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.9);
  max-width: 600px;
}

.lux-footer-pills {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 2vw, 24px);
  flex-wrap: wrap;
  font-size: 0.8125rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lux-gold-400);
}

.lux-footer-social {
  display: flex;
  align-items: center;
  gap: 14px;
}

.lux-social-link {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.08);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.15);
  transition: var(--lux-transition);
}

.lux-social-link:hover {
  background: var(--lux-gold-500);
  border-color: var(--lux-gold-500);
  transform: translateY(-3px);
}

.lux-footer-bottom {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  flex-wrap: wrap;
  gap: 12px;
}

/* ==========================================================================
   MOBILE BOTTOM DOCK (TOUCH ERGONOMICS)
   ========================================================================== */
.lux-mobile-dock {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: var(--lux-mobile-dock-h);
  background: rgba(250, 247, 242, 0.95);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--lux-sand-border);
  z-index: 100;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.06);
}

@media (max-width: 768px) {
  html,
  body {
    max-width: 100%;
  }

  .lux-topbar-inner {
    gap: 10px;
  }

  .lux-brand-logo {
    height: 40px;
    max-width: min(42vw, 180px);
  }

  .lux-topbar-actions {
    gap: 8px;
  }

.lux-btn {
    max-width: 100%;
    white-space: normal;
  }

  .lux-hero {
    min-height: min(680px, calc(100svh - var(--lux-nav-height) - 24px));
    border-radius: var(--lux-radius-md);
  }

  .lux-hero-content {
    padding: 40px 24px;
  }

  .lux-hero-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .lux-hero-actions .lux-btn {
    width: 100%;
  }

  .lux-modal-card {
    max-height: min(720px, calc(100svh - 32px));
  }
}

@media (min-width: 769px) {
  .lux-hero,
  .lux-world-card,
  .lux-restaurant-card {
    border-radius: var(--lux-image-radius);
  }
}

/* Keep keyboard navigation visible without changing the guest layout. */
:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--lux-gold-400);
  outline-offset: 3px;
}

/* Preserve readable card sizing when translated labels are longer. */
.lux-world-card,
.lux-restaurant-card,
.lux-item-card,
.menu-item {
  min-width: 0;
}

html[dir="rtl"] .lux-hero-actions {
  justify-content: flex-start;
}

html[dir="rtl"] .lux-item-header,
html[dir="rtl"] .item-line {
  text-align: right;
}

/* ==========================================================================
   PHASE 2 GUEST ENTRY COMPOSITIONS
   ========================================================================== */
.lux-site-portal .lux-world-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 22px;
}

.lux-site-portal .lux-world-card {
  grid-column: span 4;
  min-height: 310px;
}

.lux-site-portal .lux-world-card:nth-child(1),
.lux-site-portal .lux-world-card:nth-child(2) {
  grid-column: span 6;
  min-height: 390px;
}

.lux-site-portal .lux-world-card:nth-child(1) {
  border-color: rgba(45, 140, 158, 0.55);
}

.lux-site-portal .lux-world-card:nth-child(4),
.lux-site-portal .lux-world-card:nth-child(5) {
  border-color: rgba(189, 135, 47, 0.5);
}

.lux-site-aqaba .lux-hero-scrim {
  background: linear-gradient(180deg, rgba(8, 20, 34, 0.16), rgba(8, 20, 34, 0.86));
}

.lux-site-aqaba .lux-restaurant-card:hover,
.lux-site-aqaba .lux-world-card:hover {
  border-color: var(--lux-aqua-400);
}

.lux-site-wadi-rum .lux-hero-scrim {
  background: linear-gradient(180deg, rgba(39, 24, 16, 0.12), rgba(39, 24, 16, 0.88));
}

.lux-site-wadi-rum .lux-restaurant-card,
.lux-site-wadi-rum .lux-world-card {
  border-color: rgba(189, 135, 47, 0.46);
}

.lux-site-wadi-rum .lux-restaurant-card:hover,
.lux-site-wadi-rum .lux-world-card:hover {
  border-color: var(--lux-gold-300);
}

.lux-page-dining .lux-menu-header {
  max-width: 760px;
  margin-inline: auto;
  padding-block: 56px 32px;
}

.lux-page-dining .lux-dining-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.lux-page-dining .lux-restaurant-card {
  min-height: 400px;
  height: auto;
  padding: 28px 24px;
}

.lux-page-dining .lux-restaurant-card.active {
  transform: translateY(-4px);
}

@media (max-width: 768px) {
  .lux-site-portal .lux-world-grid,
  .lux-page-dining .lux-dining-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .lux-site-portal .lux-world-card,
  .lux-site-portal .lux-world-card:nth-child(1),
  .lux-site-portal .lux-world-card:nth-child(2),
  .lux-page-dining .lux-restaurant-card {
    grid-column: auto;
    min-height: 0;
    height: 280px;
  }

  .lux-page-dining .lux-menu-header {
    padding-block: 36px 22px;
  }

  .lux-page-dining .lux-restaurant-card {
    padding: 24px 20px;
  }

  .lux-mobile-dock {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: env(safe-area-inset-bottom);
  }
  body {
    padding-bottom: calc(var(--lux-mobile-dock-h) + env(safe-area-inset-bottom));
  }
}

.lux-dock-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: var(--lux-ink-600);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 6px 12px;
  transition: var(--lux-transition);
}

.lux-dock-item.active,
.lux-dock-item:hover {
  color: var(--lux-gold-500);
}

.lux-dock-icon {
  font-size: 1.15rem;
  line-height: 1;
}

/* ==========================================================================
   ACCESSIBILITY & REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* LUXOTEL HOME REDESIGN 20260827 */
.lux-destinations{
  padding-top:54px;
  padding-bottom:54px;
}

.lux-section-head{
  text-align:center;
  max-width:680px;
  margin:0 auto 30px;
}

.lux-section-head .lux-kicker{
  display:block;
  color:#bd8b36;
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  margin-bottom:8px;
}

.lux-section-head h2{
  margin:0;
  color:#0d3152;
  font-family:Georgia,serif;
  font-size:clamp(2rem,4vw,3.2rem);
  font-weight:400;
}

.lux-section-head p{
  margin:10px 0 0;
  color:#687786;
  font-size:15px;
}

.lux-destination-pair{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
}

.lux-destination-card{
  position:relative;
  min-height:520px;
  border-radius:28px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  text-decoration:none;
  background:#0d3152;
  box-shadow:0 18px 42px rgba(13,49,82,.12);
}

.lux-destination-media{
  position:absolute;
  inset:0;
}

.lux-destination-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.lux-destination-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,22,38,.05) 26%,rgba(5,22,38,.88) 100%);
}

.lux-destination-content{
  position:relative;
  z-index:2;
  padding:36px;
  color:#fff;
  width:100%;
}

.lux-destination-content span{
  display:block;
  color:#d6a64a;
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  margin-bottom:9px;
}

.lux-destination-content h3{
  margin:0;
  font-family:Georgia,serif;
  font-size:clamp(2rem,3vw,3rem);
  font-weight:400;
}

.lux-destination-content p{
  margin:10px 0 22px;
  font-size:15px;
  color:rgba(255,255,255,.9);
}

.lux-destination-content strong{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 20px;
  border-radius:999px;
  background:#bd8b36;
  color:#fff;
  font-size:11px;
  letter-spacing:.08em;
}

@media(max-width:820px){
  .lux-destinations{
    padding-top:36px;
    padding-bottom:36px;
  }

  .lux-destination-pair{
    grid-template-columns:1fr;
    gap:18px;
  }

  .lux-destination-card{
    min-height:360px;
    border-radius:22px;
  }

  .lux-destination-content{
    padding:24px;
  }

  .lux-section-head{
    margin-bottom:22px;
    padding:0 12px;
  }
}


/* LUXOTEL GALLERY SYSTEM 20260827 */
.lux-gallery{
  position:absolute;
  inset:0;
  overflow:hidden;
}

.lux-gallery-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .8s ease;
  pointer-events:none;
}

.lux-gallery-image.is-active{
  opacity:1;
}

.lux-gallery[data-gallery-transition="slide"] .lux-gallery-image{
  opacity:1;
  transform:translateX(100%);
  transition:transform .8s ease;
}

.lux-gallery[data-gallery-transition="slide"] .lux-gallery-image.is-active{
  transform:translateX(0);
}

.lux-gallery[data-gallery-transition="slide"] .lux-gallery-image.was-active{
  transform:translateX(-100%);
}

@media (prefers-reduced-motion: reduce){
  .lux-gallery-image{
    transition:none!important;
  }
}


/* LUXOTEL SMOOTH GALLERY TRANSITIONS 20260827 */

.lux-gallery{
  --lux-gallery-speed:800ms;
  position:absolute;
  inset:0;
  overflow:hidden;
}

.lux-gallery-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
  will-change:opacity,transform;
  backface-visibility:hidden;
}


/* FADE */
.lux-gallery[data-gallery-transition="fade"] .lux-gallery-image{
  opacity:0;
  transition:opacity var(--lux-gallery-speed) ease;
}

.lux-gallery[data-gallery-transition="fade"] .lux-gallery-image.is-active{
  opacity:1;
}


/* CROSSFADE */
.lux-gallery[data-gallery-transition="crossfade"] .lux-gallery-image{
  opacity:0;
  transform:scale(1.015);
  transition:
    opacity var(--lux-gallery-speed) ease,
    transform var(--lux-gallery-speed) ease;
}

.lux-gallery[data-gallery-transition="crossfade"] .lux-gallery-image.is-active{
  opacity:1;
  transform:scale(1);
}


/* SLIDE LEFT */
.lux-gallery[data-gallery-transition="slide-left"] .lux-gallery-image{
  opacity:1;
  transform:translate3d(100%,0,0);
  transition:transform var(--lux-gallery-speed) cubic-bezier(.4,0,.2,1);
}

.lux-gallery[data-gallery-transition="slide-left"] .lux-gallery-image.is-active{
  transform:translate3d(0,0,0);
}

.lux-gallery[data-gallery-transition="slide-left"] .lux-gallery-image.was-active{
  transform:translate3d(-100%,0,0);
}


/* SLIDE RIGHT */
.lux-gallery[data-gallery-transition="slide-right"] .lux-gallery-image{
  opacity:1;
  transform:translate3d(-100%,0,0);
  transition:transform var(--lux-gallery-speed) cubic-bezier(.4,0,.2,1);
}

.lux-gallery[data-gallery-transition="slide-right"] .lux-gallery-image.is-active{
  transform:translate3d(0,0,0);
}

.lux-gallery[data-gallery-transition="slide-right"] .lux-gallery-image.was-active{
  transform:translate3d(100%,0,0);
}


/* SLIDE UP */
.lux-gallery[data-gallery-transition="slide-up"] .lux-gallery-image{
  opacity:1;
  transform:translate3d(0,100%,0);
  transition:transform var(--lux-gallery-speed) cubic-bezier(.4,0,.2,1);
}

.lux-gallery[data-gallery-transition="slide-up"] .lux-gallery-image.is-active{
  transform:translate3d(0,0,0);
}

.lux-gallery[data-gallery-transition="slide-up"] .lux-gallery-image.was-active{
  transform:translate3d(0,-100%,0);
}


/* SLIDE DOWN */
.lux-gallery[data-gallery-transition="slide-down"] .lux-gallery-image{
  opacity:1;
  transform:translate3d(0,-100%,0);
  transition:transform var(--lux-gallery-speed) cubic-bezier(.4,0,.2,1);
}

.lux-gallery[data-gallery-transition="slide-down"] .lux-gallery-image.is-active{
  transform:translate3d(0,0,0);
}

.lux-gallery[data-gallery-transition="slide-down"] .lux-gallery-image.was-active{
  transform:translate3d(0,100%,0);
}


/* ZOOM IN */
.lux-gallery[data-gallery-transition="zoom-in"] .lux-gallery-image{
  opacity:0;
  transform:scale(.96);
  transition:
    opacity var(--lux-gallery-speed) ease,
    transform var(--lux-gallery-speed) ease;
}

.lux-gallery[data-gallery-transition="zoom-in"] .lux-gallery-image.is-active{
  opacity:1;
  transform:scale(1);
}


/* ZOOM OUT */
.lux-gallery[data-gallery-transition="zoom-out"] .lux-gallery-image{
  opacity:0;
  transform:scale(1.06);
  transition:
    opacity var(--lux-gallery-speed) ease,
    transform var(--lux-gallery-speed) ease;
}

.lux-gallery[data-gallery-transition="zoom-out"] .lux-gallery-image.is-active{
  opacity:1;
  transform:scale(1);
}


/* KEN BURNS LITE */
.lux-gallery[data-gallery-transition="ken-burns"] .lux-gallery-image{
  opacity:0;
  transform:scale(1.035);
  transition:
    opacity var(--lux-gallery-speed) ease,
    transform 6s ease-out;
}

.lux-gallery[data-gallery-transition="ken-burns"] .lux-gallery-image.is-active{
  opacity:1;
  transform:scale(1.09);
}


@media (prefers-reduced-motion: reduce){
  .lux-gallery-image{
    transition:opacity .25s linear!important;
    transform:none!important;
  }
}


/* LUXOTEL MENU MOBILE UX 20260827 */

/*
 * Horizontal category rail.
 * Keep the active choice readable while allowing the next option
 * to remain partially visible as a natural swipe cue.
 */
.lux-auto-category-bar,
.category-tabs,
.category-nav,
.menu-categories,
.v12-category-tabs,
[data-category-bar]{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  padding-inline:4px 18px;
}

.lux-auto-category-bar::-webkit-scrollbar,
.category-tabs::-webkit-scrollbar,
.category-nav::-webkit-scrollbar,
.menu-categories::-webkit-scrollbar,
.v12-category-tabs::-webkit-scrollbar,
[data-category-bar]::-webkit-scrollbar{
  display:none;
}

.lux-auto-category-bar > *,
.category-tabs > *,
.category-nav > *,
.menu-categories > *,
.v12-category-tabs > *,
[data-category-bar] > *{
  flex:0 0 auto;
  scroll-snap-align:center;
}


/* Preserve a clear selected category */
[data-category].active,
[data-category].is-active,
[data-category-id].active,
[data-category-id].is-active,
[data-section].active,
[data-section].is-active,
.category-tabs button.active,
.category-tabs button.is-active,
.category-nav button.active,
.category-nav button.is-active,
.menu-categories button.active,
.menu-categories button.is-active,
.v12-category-tabs button.active,
.v12-category-tabs button.is-active{
  position:relative;
}


/*
 * Hidden categories must actually disappear from layout, not leave
 * a blank section.
 */
[data-menu-section][hidden],
[data-category-section][hidden],
.menu-section[hidden],
.category-section[hidden]{
  display:none!important;
}


/* MOBILE */
@media(max-width:720px){

  /*
   * Leave enough room at the bottom so the fixed Food/Beverages bar
   * never covers the last menu item.
   */
  body{
    padding-bottom:
      calc(78px + env(safe-area-inset-bottom, 0px));
  }

  /*
   * Food / Beverages controls stay reachable from the thumb zone.
   * Only an existing menu mode bar receives this behavior.
   */
  .lux-mobile-mode-bar,
  .menu-mode,
  .menu-type,
  .food-drinks,
  .v12-menu-tabs,
  [data-menu-mode-bar]{
    position:fixed!important;
    left:10px;
    right:10px;
    bottom:
      calc(10px + env(safe-area-inset-bottom, 0px));
    z-index:950;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:8px!important;
    border:1px solid rgba(189,135,47,.28);
    border-radius:18px;
    background:rgba(255,250,243,.96);
    box-shadow:
      0 12px 34px rgba(9,36,61,.18);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  .lux-mobile-mode-bar > *,
  .menu-mode > *,
  .menu-type > *,
  .food-drinks > *,
  .v12-menu-tabs > *,
  [data-menu-mode-bar] > *{
    flex:1 1 0;
    min-width:0;
  }

  /*
   * Category buttons remain in the content area and swipe
   * horizontally. Give them room for comfortable touch targets.
   */
  .lux-auto-category-bar,
  .category-tabs,
  .category-nav,
  .menu-categories,
  .v12-category-tabs,
  [data-category-bar]{
    margin-inline:-4px;
    padding-top:5px;
    padding-bottom:7px;
  }

  .lux-auto-category-bar button,
  .category-tabs button,
  .category-nav button,
  .menu-categories button,
  .v12-category-tabs button,
  [data-category-bar] button{
    min-height:42px;
    white-space:nowrap;
    touch-action:manipulation;
  }
}


/*
 * Do not animate scrolling for users who have requested reduced motion.
 */
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto!important;
  }

  .lux-auto-category-bar,
  .category-tabs,
  .category-nav,
  .menu-categories,
  .v12-category-tabs,
  [data-category-bar]{
    scroll-behavior:auto!important;
  }
}

/* ==========================================================================\n   DINING UX REFINEMENT 20260827 - compact, simple, touch-friendly\n   ========================================================================== */
.lux-page-dining .lux-dining-grid { gap:18px; }
.lux-page-dining .lux-restaurant-card {
  height:340px;
  min-height:340px;
  padding:24px;
  border-radius:22px;
}
.lux-page-dining .lux-restaurant-card.active {
  transform:none;
  border-color:var(--lux-gold-400);
  box-shadow:0 12px 34px rgba(13,27,42,.16);
}
.lux-page-dining .lux-restaurant-desc {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  max-width:30ch;
}
.lux-page-dining .lux-btn-circle { flex:0 0 auto; }
.lux-no-results { text-align:center; padding:42px 0; color:var(--lux-ink-600); }

@media (max-width:720px) {
  .lux-page-dining .lux-menu-header { padding:30px 10px 18px; }
  .lux-page-dining .lux-menu-header .lux-hero-title { font-size:clamp(2rem,10vw,2.7rem) !important; }
  .lux-page-dining .lux-dining-grid { gap:14px; margin-top:20px; margin-bottom:28px !important; }
  .lux-page-dining .lux-restaurant-card {
    height:220px;
    min-height:220px;
    padding:20px;
    border-radius:20px;
  }
  .lux-page-dining .lux-restaurant-body { gap:12px; }
  .lux-page-dining .lux-restaurant-name { font-size:1.55rem; margin-bottom:4px; }
  .lux-page-dining .lux-restaurant-desc { font-size:.82rem; line-height:1.35; }
  .lux-page-dining .lux-restaurant-tag { font-size:.66rem; margin-bottom:4px; }
  .lux-page-dining .lux-btn-circle { width:46px; height:46px; }
  .lux-menu-toolbar-wrap { margin-bottom:20px; }
  .lux-menu-toolbar-inner { gap:12px; }
  .lux-group-segmented { order:1; }
  .lux-menu-search { order:2; width:100%; max-width:380px; }
  .lux-menu-search input { width:100%; }
  .menu-section { scroll-margin-top:calc(var(--lux-nav-height) + 10px); }
  .lux-menu-divider { scroll-margin-top:calc(var(--lux-nav-height) + 10px); }
}

/* =========================================================
   MOBILE DINING RESTAURANT CARDS
   Compact luxury cards - mobile only
   ========================================================= */
@media (max-width:650px){

  .lux-page-dining .lux-dining-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;

    width:calc(100% - 16px)!important;
    margin:8px auto 14px!important;

    padding:0!important;
  }

  .lux-page-dining .lux-restaurant-card{
    position:relative!important;

    width:100%!important;
    min-width:0!important;

    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;

    margin:0!important;
    padding:0!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    background:#fffaf2!important;
    border:1px solid #b9862f!important;
    border-radius:5px!important;

    box-shadow:
      inset 0 0 0 3px #fffaf2,
      inset 0 0 0 4px rgba(185,134,47,.28),
      0 3px 10px rgba(16,45,79,.05)!important;

    overflow:hidden!important;
  }

  /* Hide images completely on mobile */
  .lux-page-dining .lux-restaurant-media,
  .lux-page-dining .lux-restaurant-scrim{
    display:none!important;
  }

  .lux-page-dining .lux-restaurant-body{
    position:static!important;

    width:100%!important;
    height:100%!important;

    padding:7px 4px!important;
    margin:0!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    background:transparent!important;
  }

  .lux-page-dining .lux-restaurant-info{
    width:100%!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    text-align:center!important;
  }

  /* Only show restaurant name */
  .lux-page-dining .lux-restaurant-tag,
  .lux-page-dining .lux-restaurant-desc,
  .lux-page-dining .lux-btn-circle{
    display:none!important;
  }

  .lux-page-dining .lux-restaurant-name{
    margin:0!important;
    padding:0 3px!important;

    color:#102d4f!important;

    font:700 10px/1.15 Arial,sans-serif!important;
    letter-spacing:.035em!important;

    text-align:center!important;
    white-space:normal!important;

    text-shadow:none!important;
  }

  /* Gold luxury corners */
  .lux-page-dining .lux-restaurant-card::before{
    content:""!important;

    position:absolute!important;
    top:5px!important;
    left:5px!important;

    width:10px!important;
    height:10px!important;

    border-top:1px solid #b9862f!important;
    border-left:1px solid #b9862f!important;

    pointer-events:none!important;
  }

  .lux-page-dining .lux-restaurant-card::after{
    content:""!important;

    position:absolute!important;
    right:5px!important;
    bottom:5px!important;

    width:10px!important;
    height:10px!important;

    border-right:1px solid #b9862f!important;
    border-bottom:1px solid #b9862f!important;

    pointer-events:none!important;
  }

  /* Selected restaurant */
  .lux-page-dining .lux-restaurant-card.active{
    background:#102d4f!important;
    border-color:#b9862f!important;

    box-shadow:
      inset 0 0 0 3px #102d4f,
      inset 0 0 0 4px #c89b45,
      0 4px 12px rgba(16,45,79,.16)!important;
  }

  .lux-page-dining .lux-restaurant-card.active .lux-restaurant-name{
    color:#fff!important;
  }

  .lux-page-dining .lux-restaurant-card.active::before,
  .lux-page-dining .lux-restaurant-card.active::after{
    border-color:#d8b263!important;
  }
}


/* Hide side contact tab on mobile */
@media (max-width:650px){
  .lux-contact-side-tab{
    display:none!important;
  }
}


/* =========================================================
   MOBILE HOME COMPACT EXPERIENCE LAYOUT
   Dining full width + RDC / Spa side by side
   ========================================================= */
@media (max-width:650px){

  body:not(.lux-page-dining) .lux-dining-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;

    width:calc(100% - 18px)!important;
    margin:14px auto 18px!important;
    padding:0!important;
  }

  /* Dining = main card */
  body:not(.lux-page-dining) .lux-dining-grid > .lux-restaurant-card:first-child{
    grid-column:1 / -1!important;

    height:118px!important;
    min-height:118px!important;
  }

  /* RDC + SPA */
  body:not(.lux-page-dining) .lux-dining-grid > .lux-restaurant-card:nth-child(2),
  body:not(.lux-page-dining) .lux-dining-grid > .lux-restaurant-card:nth-child(3){
    height:96px!important;
    min-height:96px!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-card{
    position:relative!important;
    margin:0!important;

    border-radius:13px!important;
    overflow:hidden!important;

    box-shadow:0 6px 18px rgba(16,45,79,.09)!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-media{
    position:absolute!important;
    inset:0!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-media img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-scrim{
    display:block!important;
    position:absolute!important;
    inset:0!important;

    background:
      linear-gradient(
        180deg,
        rgba(16,45,79,.12),
        rgba(16,45,79,.74)
      )!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-body{
    position:absolute!important;
    inset:0!important;

    display:flex!important;
    align-items:flex-end!important;

    padding:11px 12px!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-info{
    width:100%!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-tag{
    display:none!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-desc{
    display:none!important;
  }

  body:not(.lux-page-dining) .lux-restaurant-name{
    margin:0!important;

    color:#fff!important;
    font-size:14px!important;
    line-height:1.1!important;
    letter-spacing:.025em!important;

    text-shadow:0 2px 8px rgba(0,0,0,.35)!important;
  }

  body:not(.lux-page-dining) .lux-dining-grid > .lux-restaurant-card:first-child
  .lux-restaurant-name{
    font-size:17px!important;
  }

  body:not(.lux-page-dining) .lux-btn-circle{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;

    font-size:14px!important;

    border:1px solid rgba(217,179,106,.9)!important;
    background:rgba(16,45,79,.45)!important;
  }

  /* Reduce homepage section intro */
  body:not(.lux-page-dining) .lux-section-header{
    margin-bottom:10px!important;
  }

  body:not(.lux-page-dining) .lux-section-desc{
    display:none!important;
  }

  body:not(.lux-page-dining) .lux-section-title{
    margin-bottom:4px!important;
  }
}


/* =========================================================
   AQABA PROPERTY INTRO
   Replaces large image hero on property landing page
   ========================================================= */

.lux-property-intro{
  position:relative;
  width:min(920px,calc(100% - 32px));
  margin:34px auto 44px;
  padding:42px 28px 38px;
  text-align:center;
}

.lux-property-intro::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:74px;
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(
    90deg,
    transparent,
    var(--lux-gold-500,#b9862f),
    transparent
  );
}

.lux-property-intro-kicker{
  display:block;
  margin-bottom:13px;
  color:var(--lux-gold-500,#b9862f);
  font:800 9px/1 Arial,sans-serif;
  letter-spacing:.26em;
}

.lux-property-intro-title{
  margin:0;
  color:var(--lux-navy-900,#102d4f);
  font-family:var(--lux-font-display,Georgia,serif);
  font-size:clamp(42px,6vw,72px);
  font-weight:400;
  line-height:.96;
  letter-spacing:-.035em;
}

.lux-property-intro-ornament{
  width:min(330px,70%);
  margin:19px auto 17px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.lux-property-intro-ornament span{
  height:1px;
  flex:1;
  background:linear-gradient(
    90deg,
    transparent,
    var(--lux-gold-500,#b9862f)
  );
}

.lux-property-intro-ornament span:last-child{
  background:linear-gradient(
    90deg,
    var(--lux-gold-500,#b9862f),
    transparent
  );
}

.lux-property-intro-ornament b{
  color:var(--lux-gold-500,#b9862f);
  font-size:15px;
  font-weight:400;
}

.lux-property-intro-copy{
  max-width:600px;
  margin:0 auto;
  color:var(--lux-ink-600,#66717b);
  font:400 13px/1.7 Arial,sans-serif;
}

@media (max-width:650px){

  .lux-property-intro{
    width:calc(100% - 20px);
    margin:15px auto 20px;
    padding:25px 12px 18px;
  }

  .lux-property-intro-kicker{
    margin-bottom:10px;
    font-size:8px;
    letter-spacing:.23em;
  }

  .lux-property-intro-title{
    font-size:clamp(34px,11vw,47px);
    line-height:.94;
  }

  .lux-property-intro-ornament{
    width:72%;
    margin:14px auto 12px;
  }

  .lux-property-intro-copy{
    max-width:330px;
    font-size:11px;
    line-height:1.55;
  }

  .lux-property-intro + section{
    margin-top:0!important;
  }
}


/* =========================================================
   LUXOTEL MINIMAL BRAND FOOTER
   Logo + social links only
   ========================================================= */

.lux-site-aqaba .lux-footer{
  margin:18px 0 0!important;
  padding:14px 0 12px!important;
  min-height:0!important;

  background:transparent!important;
  border-top:1px solid rgba(185,134,47,.20)!important;
  box-shadow:none!important;
}

.lux-site-aqaba .lux-footer-inner{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;

  gap:9px!important;
  min-height:0!important;
  padding:0 16px!important;
}

/* Small Luxotel logo */
.lux-site-aqaba .lux-footer-logo{
  display:block!important;
  width:48px!important;
  max-width:48px!important;
  height:auto!important;

  margin:0!important;
  padding:0!important;
}

/* Remove all footer text */
.lux-site-aqaba .lux-footer-tagline,
.lux-site-aqaba .lux-footer-pills,
.lux-site-aqaba .lux-footer-bottom{
  display:none!important;
}

/* Social icons row */
.lux-site-aqaba .lux-footer-social{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  gap:9px!important;
  margin:0!important;
  padding:0!important;
}

/* Compact luxury social buttons */
.lux-site-aqaba .lux-social-link{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;

  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;

  margin:0!important;
  padding:0!important;

  border:1px solid rgba(185,134,47,.65)!important;
  border-radius:50%!important;

  background:rgba(255,250,242,.72)!important;
  color:#b9862f!important;

  font-size:14px!important;
  line-height:1!important;
  text-decoration:none!important;

  box-shadow:none!important;
}

@media (hover:hover) and (pointer:fine){
  .lux-site-aqaba .lux-social-link:hover{
    background:#102d4f!important;
    color:#fff!important;
    border-color:#b9862f!important;
    transform:translateY(-1px)!important;
  }
}

@media (max-width:650px){

  .lux-site-aqaba .lux-footer{
    margin-top:12px!important;
    padding:10px 0 9px!important;
  }

  .lux-site-aqaba .lux-footer-logo{
    width:42px!important;
    max-width:42px!important;
  }

  .lux-site-aqaba .lux-footer-inner{
    gap:7px!important;
  }

  .lux-site-aqaba .lux-footer-social{
    gap:7px!important;
  }

  .lux-site-aqaba .lux-social-link{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    font-size:13px!important;
  }
}


/* =========================================================
   LUXOTEL SOCIAL SVG ICONS
   ========================================================= */

.lux-social-link .lux-social-svg{
  display:block!important;
  width:15px!important;
  height:15px!important;
  max-width:15px!important;
  max-height:15px!important;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;

  pointer-events:none!important;
}

/* Facebook + Review use elegant solid mark */
.lux-social-link[aria-label="Facebook"] .lux-social-svg,
.lux-social-link[aria-label="Google Review"] .lux-social-svg{
  fill:currentColor!important;
  stroke:none!important;
}

@media(max-width:650px){
  .lux-social-link .lux-social-svg{
    width:14px!important;
    height:14px!important;
    max-width:14px!important;
    max-height:14px!important;
  }
}


/* =========================================================
   THIN LUXURY MOBILE DOCK
   Home | Dining | RDC | Spa | Contact
   ========================================================= */

@media (max-width:650px){

  .lux-mobile-dock{
    position:fixed!important;

    left:50%!important;
    right:auto!important;
    bottom:max(7px, env(safe-area-inset-bottom))!important;

    transform:translateX(-50%)!important;

    width:calc(100% - 18px)!important;
    max-width:430px!important;

    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;

    margin:0!important;
    padding:4px 6px!important;

    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;

    background:rgba(14,43,70,.96)!important;

    border:1px solid rgba(201,155,70,.72)!important;
    border-radius:16px!important;

    box-shadow:
      0 8px 24px rgba(16,45,79,.22),
      inset 0 0 0 1px rgba(255,255,255,.025)!important;

    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;

    z-index:9500!important;

    overflow:hidden!important;
  }

  .lux-mobile-dock .lux-dock-item{
    position:relative!important;

    height:40px!important;
    min-height:40px!important;

    margin:0!important;
    padding:3px 2px!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;

    background:transparent!important;
    border:0!important;
    border-radius:11px!important;

    color:rgba(255,255,255,.72)!important;

    text-decoration:none!important;

    font:700 7px/1 Arial,sans-serif!important;
    letter-spacing:.015em!important;

    box-shadow:none!important;
  }

  .lux-mobile-dock .lux-dock-icon{
    display:block!important;

    margin:0!important;
    padding:0!important;

    font-size:14px!important;
    line-height:14px!important;

    transform:none!important;
  }

  .lux-mobile-dock .lux-dock-item.active{
    background:rgba(201,155,70,.13)!important;
    color:#e0b968!important;
  }

  .lux-mobile-dock .lux-dock-item.active::after{
    content:""!important;

    position:absolute!important;
    left:50%!important;
    bottom:1px!important;

    width:16px!important;
    height:1px!important;

    transform:translateX(-50%)!important;

    background:#d5aa58!important;
    border-radius:2px!important;
  }

  /* Prevent content from being hidden behind the thin dock */
  body:has(.lux-mobile-dock){
    padding-bottom:62px!important;
  }
}


/* =========================================================
   RDC MENU - ULTRA COMPACT HERO
   ========================================================= */

@media (max-width:650px){

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]){
    min-height:145px!important;
    height:145px!important;
    max-height:145px!important;

    margin-top:8px!important;
    margin-bottom:10px!important;

    border-radius:12px!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-content{
    padding:12px 14px!important;
    min-height:145px!important;
    justify-content:center!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-content > img{
    height:30px!important;
    max-height:30px!important;
    margin-bottom:6px!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-kicker{
    margin-bottom:4px!important;
    font-size:7px!important;
    letter-spacing:.14em!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-title{
    margin:0!important;
    font-size:24px!important;
    line-height:1!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-subtitle{
    display:none!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-actions{
    margin-top:7px!important;
    gap:6px!important;
  }

  body.lux-site-aqaba .lux-hero:has(img[alt="Royal Diving Club"]) .lux-hero-actions .lux-btn{
    min-height:30px!important;
    padding:0 12px!important;
    font-size:7px!important;
  }
}


/* =========================================================
   COMPACT MENU ACTION BUTTONS
   Allergen Info + Order / Service
   ========================================================= */

@media (max-width:650px){

  .lux-page-dining .lux-btn[data-open-allergens],
  .lux-page-dining .lux-btn[data-open-contact],
  body.lux-site-aqaba .lux-menu-content-root ~ * .lux-btn[data-open-allergens],
  body.lux-site-aqaba .lux-menu-content-root ~ * .lux-btn[data-open-contact]{
    min-height:30px!important;
    height:30px!important;

    padding:0 11px!important;
    margin:0!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;

    border-radius:999px!important;

    font-size:7.5px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.06em!important;

    box-shadow:none!important;
  }

  /* Allergen */
  .lux-btn[data-open-allergens]{
    background:#fffaf2!important;
    color:#102d4f!important;
    border:1px solid rgba(185,134,47,.68)!important;
  }

  /* Order / Service */
  .lux-btn[data-open-contact]{
    background:#102d4f!important;
    color:#d8b263!important;
    border:1px solid rgba(185,134,47,.72)!important;
  }

  .lux-btn[data-open-allergens] span,
  .lux-btn[data-open-contact] span{
    font-size:inherit!important;
  }

  /* Remove oversized emoji appearance */
  .lux-btn[data-open-contact]{
    font-size:0!important;
  }

  .lux-btn[data-open-contact] span{
    font-size:7.5px!important;
  }

  .lux-btn[data-open-contact]::before{
    content:"◇"!important;
    display:inline-block!important;
    font-size:10px!important;
    line-height:1!important;
    color:#d8b263!important;
  }

  .lux-btn[data-open-allergens]::before{
    content:"i"!important;

    width:14px!important;
    height:14px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    border:1px solid #b9862f!important;
    border-radius:50%!important;

    color:#b9862f!important;

    font:800 8px/1 Georgia,serif!important;
  }
}


/* =========================================================
   SPA BOOK / INQUIRE BUTTON
   ========================================================= */

@media (max-width:650px){

  .lux-spa-book-btn{
    width:auto!important;
    min-width:0!important;

    height:34px!important;
    min-height:34px!important;

    padding:0 15px!important;
    margin:5px 0 0!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;

    background:rgba(255,250,242,.94)!important;
    color:#102d4f!important;

    border:1px solid #b9862f!important;
    border-radius:999px!important;

    font-size:8px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.10em!important;

    box-shadow:
      0 4px 12px rgba(16,45,79,.10),
      inset 0 0 0 1px rgba(185,134,47,.12)!important;
  }

  .lux-spa-book-btn::before{
    content:"◇"!important;
    display:inline-block!important;

    color:#b9862f!important;
    font-size:10px!important;
    line-height:1!important;
  }

  .lux-spa-book-btn span{
    font-size:8px!important;
  }
}


/* SPA BOOK / INQUIRE BUTTON FIX */
@media (max-width:650px){

  .lux-spa-book-btn{
    width:auto!important;
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;

    padding:0 15px!important;
    margin:5px 0 0!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;

    background:rgba(255,250,242,.94)!important;
    color:#102d4f!important;

    border:1px solid #b9862f!important;
    border-radius:999px!important;

    font-size:8px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.10em!important;

    box-shadow:0 4px 12px rgba(16,45,79,.10)!important;
  }

  .lux-spa-book-btn::before{
    content:"◇"!important;
    color:#b9862f!important;
    font-size:10px!important;
    line-height:1!important;
  }
}


/* =========================================================
   FINAL SPA BOOK BUTTON FIX
   Override generic contact-button rules
   ========================================================= */
@media (max-width:650px){

  body.lux-site-aqaba .lux-btn.lux-spa-book-btn[data-open-contact]{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;

    height:32px!important;
    min-height:32px!important;
    max-height:32px!important;

    padding:0 14px!important;
    margin:6px 0 0!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    background:rgba(255,250,242,.96)!important;
    color:#102d4f!important;

    border:1px solid #b9862f!important;
    border-radius:999px!important;

    font-family:Arial,sans-serif!important;
    font-size:8px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.09em!important;

    text-indent:0!important;
    opacity:1!important;
    visibility:visible!important;

    box-shadow:0 4px 12px rgba(16,45,79,.10)!important;
  }

  body.lux-site-aqaba .lux-btn.lux-spa-book-btn[data-open-contact]::before{
    content:none!important;
    display:none!important;
  }

  body.lux-site-aqaba .lux-btn.lux-spa-book-btn[data-open-contact]::after{
    content:none!important;
    display:none!important;
  }
}


/* =========================================================
   COMPACT HEADER ACTION BUTTONS
   Language + adjacent header action
   ========================================================= */

.lux-topbar-actions{
  gap:6px!important;
}

.lux-topbar .lux-nav-toggle,
.lux-topbar .lux-topbar-actions > .lux-btn{
  min-height:28px!important;
  height:28px!important;

  padding:0 8px!important;

  border-radius:999px!important;

  font-size:8px!important;
  line-height:1!important;

  box-shadow:none!important;
}

/* Language button specifically */
/* Hamburger button */
.lux-topbar .lux-nav-toggle{
  width:30px!important;
  min-width:30px!important;
  padding:0 7px!important;
}

/* Smaller hamburger lines */
.lux-topbar .lux-nav-toggle span{
  width:14px!important;
  height:1px!important;
  margin:2px auto!important;
}

/* If there is a gold action beside language */
.lux-topbar .lux-topbar-actions > .lux-btn{
  min-width:0!important;
  padding-left:10px!important;
  padding-right:10px!important;
  font-size:7.5px!important;
}

@media(max-width:650px){

  .lux-topbar-actions{
    gap:5px!important;
  }

.lux-topbar .lux-nav-toggle{
    width:28px!important;
    min-width:28px!important;
    height:27px!important;
    min-height:27px!important;
  }
}


/* =========================================================
   WADI RUM MOBILE PROPERTY MATCH
   Match Aqaba property landing composition
   ========================================================= */

@media (max-width:650px){

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-dining-grid > .lux-restaurant-card:nth-child(2){
    grid-column:1 / -1!important;
    width:100%!important;
    height:96px!important;
    min-height:96px!important;
  }

}

/* Remove destination card arrows on Aqaba and Wadi Rum */
body.lux-site-aqaba .lux-restaurant-card .lux-btn-circle,
body.lux-site-wadi-rum .lux-restaurant-card .lux-btn-circle{
  display:none!important;
}


/* LUXOTEL MOBILE PROPERTY CARD TEXT CENTER */
@media (max-width:650px){

  body.lux-site-aqaba:not(.lux-page-dining) .lux-restaurant-body,
  body.lux-site-wadi-rum:not(.lux-page-dining) .lux-restaurant-body{
    position:absolute!important;
    inset:0!important;

    width:100%!important;
    height:100%!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    padding:10px 12px!important;
    text-align:center!important;
  }

  body.lux-site-aqaba:not(.lux-page-dining) .lux-restaurant-info,
  body.lux-site-wadi-rum:not(.lux-page-dining) .lux-restaurant-info{
    width:100%!important;
    height:auto!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;

    text-align:center!important;
  }

  body.lux-site-aqaba:not(.lux-page-dining) .lux-restaurant-name,
  body.lux-site-wadi-rum:not(.lux-page-dining) .lux-restaurant-name{
    width:100%!important;
    margin:0!important;
    padding:0 4px!important;

    text-align:center!important;
    color:#fff!important;
  }

}


/* WADI RUM FOOTER MATCH AQABA */

body.lux-site-wadi-rum .lux-footer{
  margin:18px 0 0!important;
  padding:14px 0 12px!important;
  min-height:0!important;

  background:transparent!important;
  border-top:1px solid rgba(185,134,47,.20)!important;
  box-shadow:none!important;
}

body.lux-site-wadi-rum .lux-footer-inner{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;

  gap:9px!important;
  min-height:0!important;
  padding:0 16px!important;
}

/* Small Luxotel logo */
body.lux-site-wadi-rum .lux-footer-logo{
  display:block!important;
  width:48px!important;
  max-width:48px!important;
  height:auto!important;

  margin:0!important;
  padding:0!important;
}

/* Remove long footer text */
body.lux-site-wadi-rum .lux-footer-tagline,
body.lux-site-wadi-rum .lux-footer-pills,
body.lux-site-wadi-rum .lux-footer-bottom{
  display:none!important;
}

/* Social icons */
body.lux-site-wadi-rum .lux-footer-social{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  gap:9px!important;
  margin:0!important;
  padding:0!important;
}

body.lux-site-wadi-rum .lux-social-link{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;

  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;

  margin:0!important;
  padding:0!important;

  border:1px solid rgba(185,134,47,.65)!important;
  border-radius:50%!important;

  background:rgba(255,250,242,.72)!important;
  color:#b9862f!important;

  box-shadow:none!important;
}

@media (max-width:650px){

  body.lux-site-wadi-rum .lux-footer{
    margin-top:12px!important;
    padding:10px 0 9px!important;
  }

  body.lux-site-wadi-rum .lux-footer-logo{
    width:42px!important;
    max-width:42px!important;
  }

  body.lux-site-wadi-rum .lux-footer-inner{
    gap:7px!important;
  }

  body.lux-site-wadi-rum .lux-footer-social{
    gap:7px!important;
  }

  body.lux-site-wadi-rum .lux-social-link{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
  }

}
/* REMOVE HAMBURGER MENU GLOBALLY */
.lux-nav-toggle{
  display:none!important;
}


/* LUXOTEL CATEGORY CLONE MOBILE CSS */

.lux-mobile-category-clone{
  display:none;
}

@media (max-width:720px){

  /* Hide original category bar inside page */
  body.lux-unified-menu-page
  .lux-menu-toolbar-wrap .lux-category-dock{
    display:none!important;
  }

  /* Fixed category bar above bottom navigation */
  body.lux-unified-menu-page >
  .lux-mobile-category-clone{

    position:fixed!important;

    left:9px!important;
    right:9px!important;
    bottom:62px!important;

    z-index:9400!important;

    width:auto!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;

    margin:0!important;
    padding:5px 7px!important;

    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;

    align-items:center!important;
    justify-content:flex-start!important;

    gap:7px!important;

    overflow-x:auto!important;
    overflow-y:hidden!important;

    white-space:nowrap!important;

    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;

    background:rgba(250,247,242,.98)!important;

    border:1px solid rgba(185,134,47,.58)!important;
    border-radius:14px!important;

    box-shadow:0 7px 22px rgba(16,45,79,.15)!important;

    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }

  body.lux-unified-menu-page >
  .lux-mobile-category-clone::-webkit-scrollbar{
    display:none!important;
  }

  body.lux-unified-menu-page >
  .lux-mobile-category-clone .lux-cat-pill{

    flex:0 0 auto!important;

    width:auto!important;
    min-width:max-content!important;

    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;

    margin:0!important;
    padding:7px 14px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    background:#fffaf2!important;
    color:#102d4f!important;

    border:1px solid rgba(185,134,47,.55)!important;
    border-radius:10px!important;

    font-size:11px!important;
    font-weight:700!important;
    line-height:1!important;

    white-space:nowrap!important;
  }

  body.lux-unified-menu-page >
  .lux-mobile-category-clone .lux-cat-pill.active{

    background:#102d4f!important;
    color:#fff!important;
    border-color:#b9862f!important;
  }

  body.lux-unified-menu-page:has(.lux-mobile-category-clone){
    padding-bottom:122px!important;
  }

}

/* END LUXOTEL CATEGORY CLONE MOBILE CSS */





/* =========================================================
   MOBILE FULL-BLEED PAGE HEROES / BANNERS
   Outer presentation only; content, media crop, and height stay intact.
   ========================================================= */
@media (max-width:720px){
  body.lux-site-aqaba main.lux-container > .lux-property-intro,
  body.lux-site-wadi-rum main.lux-container > .lux-property-intro,
  body.lux-page-dining main.lux-container > .lux-menu-header,
  body.lux-site-aqaba main.lux-container .lux-hero.lux-menu-identity,
  body.lux-site-wadi-rum main.lux-container .lux-hero.lux-menu-identity{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  body.lux-site-aqaba main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media,
  body.lux-site-aqaba main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media img,
  body.lux-site-aqaba main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media video,
  body.lux-site-wadi-rum main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media,
  body.lux-site-wadi-rum main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media img,
  body.lux-site-wadi-rum main.lux-container .lux-hero.lux-menu-identity > .lux-hero-media video{
    border-radius:0!important;
  }
}

/* =========================================================
   LUXOTEL OPENING HOURS GUEST
   ========================================================= */

.lux-opening-hours{
 display:inline-flex;
 align-items:center;
 gap:9px;
 max-width:100%;
 margin:10px 0 4px;
 padding:8px 11px;
 border:1px solid rgba(255,255,255,.20);
 border-radius:10px;
 background:rgba(8,29,47,.28);
 backdrop-filter:blur(7px);
 -webkit-backdrop-filter:blur(7px);
 text-align:left;
}

.lux-opening-hours-dot{
 flex:0 0 8px;
 width:8px;
 height:8px;
 border-radius:50%;
 background:#b9862f;
 box-shadow:0 0 0 3px rgba(185,134,47,.16);
}

.lux-opening-hours.is-open .lux-opening-hours-dot{
 background:#67b77a;
 box-shadow:0 0 0 3px rgba(103,183,122,.18);
}

.lux-opening-hours.is-closed .lux-opening-hours-dot,
.lux-opening-hours.is-temporary .lux-opening-hours-dot{
 background:#d27a6a;
 box-shadow:0 0 0 3px rgba(210,122,106,.16);
}

.lux-opening-hours-copy{
 display:grid;
 gap:2px;
 min-width:0;
}

.lux-opening-hours-copy strong{
 color:#fff;
 font-size:11px;
 font-weight:800;
 letter-spacing:.06em;
 text-transform:uppercase;
 line-height:1.2;
}

.lux-opening-hours-copy small{
 color:rgba(255,255,255,.86);
 font-size:11px;
 line-height:1.35;
}

html[dir="rtl"] .lux-opening-hours{
 text-align:right;
}

@media(max-width:720px){
 .lux-opening-hours{
  margin:8px 0 3px;
  padding:7px 10px;
 }

 .lux-opening-hours-copy strong{
  font-size:10px;
 }

 .lux-opening-hours-copy small{
  font-size:10px;
 }
}

/* END LUXOTEL OPENING HOURS GUEST */


/* REMOVE PUBLIC MENU SEARCH */
body.lux-unified-menu-page .lux-menu-search{
    display:none !important;
}
/* END REMOVE PUBLIC MENU SEARCH */


/* LUX HOURS DOT STATUS OVERRIDE */
.lux-hours-state{
    display:none !important;
}

.lux-hours-led{
    width:8px !important;
    height:8px !important;
    flex:0 0 8px !important;
    border-radius:50% !important;
    margin-inline-end:2px !important;
}

.lux-hours-digital.is-open .lux-hours-led{
    background:#4fd37a !important;
    box-shadow:0 0 8px rgba(79,211,122,.70) !important;
}

.lux-hours-digital.is-closed .lux-hours-led{
    background:#e14b4b !important;
    box-shadow:0 0 8px rgba(225,75,75,.65) !important;
}
/* END LUX HOURS DOT STATUS OVERRIDE */


/* LUXOTEL INLINE HOURS DISPLAY */

.lux-opening-hours-inline{
    margin-inline-start:auto;
    display:inline-flex;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
    min-height:34px;
    padding-inline:8px;
    white-space:nowrap;
    flex:0 1 auto;
}

/* Green / red status lamp */
.lux-hours-inline-dot{
    width:8px;
    height:8px;
    flex:0 0 8px;
    border-radius:50%;
}

.lux-opening-hours-inline.is-open
.lux-hours-inline-dot{
    background:#45b96f;
    box-shadow:
        0 0 0 3px rgba(69,185,111,.10),
        0 0 7px rgba(69,185,111,.52);
}

.lux-opening-hours-inline.is-closed
.lux-hours-inline-dot{
    background:#d55353;
    box-shadow:
        0 0 0 3px rgba(213,83,83,.09),
        0 0 7px rgba(213,83,83,.40);
}

/* Elegant gold separators */
.lux-hours-inline-sep{
    width:1px;
    height:16px;
    flex:0 0 1px;
    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(185,134,47,.78),
            transparent
        );
}

/* Meal / service name */
.lux-hours-inline-meal{
    font-family:var(--lux-font-display);
    font-size:12px;
    font-weight:700;
    line-height:1;
    letter-spacing:.11em;
    text-transform:uppercase;
    color:var(--lux-navy-900);
}

/* Time */
.lux-hours-inline-time{
    font-family:var(--lux-font-sans);
    font-size:10px;
    font-weight:700;
    line-height:1;
    letter-spacing:.035em;
    color:#946b28;
    font-variant-numeric:tabular-nums;
}

html[dir="rtl"] .lux-opening-hours-inline{
    direction:rtl;
}

/* MOBILE - keep Food/Beverages + hours on one line */
@media(max-width:720px){

    .lux-menu-toolbar-inner:has(.lux-opening-hours-inline){
        display:flex !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:5px !important;
    }

    .lux-menu-toolbar-inner:has(.lux-opening-hours-inline)
    .lux-group-segmented{
        flex:0 0 auto !important;
        min-width:0 !important;
        padding:3px !important;
        gap:2px !important;
    }

    .lux-menu-toolbar-inner:has(.lux-opening-hours-inline)
    .lux-group-tab{
        padding:7px 10px !important;
        font-size:9px !important;
        letter-spacing:.035em !important;
    }

    .lux-opening-hours-inline{
        flex:1 1 auto;
        min-width:0;
        max-width:none;
        gap:4px;
        padding-inline:3px;
        justify-content:flex-end;
    }

    .lux-hours-inline-dot{
        width:7px;
        height:7px;
        flex-basis:7px;
    }

    .lux-hours-inline-sep{
        height:13px;
    }

    .lux-hours-inline-meal{
        font-size:9px;
        letter-spacing:.065em;
    }

    .lux-hours-inline-time{
        font-size:8.5px;
        letter-spacing:0;
    }
}

/* END LUXOTEL INLINE HOURS DISPLAY */


/* LUXOTEL HOURS INLINE FIT FIX */

.lux-opening-hours-inline{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.lux-hours-inline-meal{
    flex:0 1 auto !important;
    min-width:0 !important;
}

.lux-hours-inline-time{
    flex:0 1 auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
}

@media(max-width:720px){

    .lux-menu-toolbar-inner:has(.lux-opening-hours-inline){
        width:100% !important;
        min-width:0 !important;
    }

    .lux-menu-toolbar-inner:has(.lux-opening-hours-inline)
    .lux-group-segmented{
        flex-shrink:0 !important;
    }

    .lux-opening-hours-inline{
        flex:1 1 0 !important;
        width:auto !important;
        min-width:0 !important;
        padding-inline:2px !important;
        gap:3px !important;
    }

    .lux-hours-inline-meal{
        font-size:8.5px !important;
        letter-spacing:.04em !important;
    }

    .lux-hours-inline-time{
        font-size:8px !important;
        letter-spacing:-.02em !important;
        font-variant-numeric:tabular-nums !important;
    }

    .lux-hours-inline-sep{
        flex-shrink:0 !important;
    }
}

/* END LUXOTEL HOURS INLINE FIT FIX */


/* LUXOTEL DINING FINAL MOBILE V3 */

@media(max-width:720px){

    /* ============================
       PAGE SPACING
       ============================ */

    .lux-page-dining .lux-menu-header{
        padding:28px 12px 20px !important;
    }

    .lux-page-dining .lux-menu-header .lux-hero-title{
        font-size:clamp(2rem,9vw,2.55rem) !important;
        line-height:1.02 !important;
        margin-bottom:9px !important;
    }

    .lux-page-dining .lux-menu-header p{
        font-size:14px !important;
        line-height:1.4 !important;
    }

    .lux-page-dining .lux-dining-grid{
        display:grid !important;
        grid-template-columns:1fr !important;

        width:100% !important;
        gap:12px !important;

        margin-top:20px !important;
        margin-bottom:30px !important;
    }


    /* ============================
       RESTAURANT CARD
       ============================ */

    .lux-page-dining .lux-restaurant-card{
        position:relative !important;

        width:100% !important;
        height:auto !important;
        min-height:132px !important;
        max-height:none !important;

        margin:0 !important;
        padding:0 !important;

        display:block !important;

        overflow:hidden !important;

        background:
            linear-gradient(
                135deg,
                #fffdf8 0%,
                #faf3e7 100%
            ) !important;

        border:1px solid rgba(185,134,47,.72) !important;
        border-radius:17px !important;

        box-shadow:
            inset 0 0 0 3px #fffaf2,
            inset 0 0 0 4px rgba(185,134,47,.16),
            0 6px 18px rgba(16,45,79,.065) !important;

        color:#102d4f !important;
        text-decoration:none !important;

        transform:none !important;
    }


    /* Remove old corner artifacts */
    .lux-page-dining .lux-restaurant-card::before,
    .lux-page-dining .lux-restaurant-card::after{
        content:none !important;
        display:none !important;
    }


    /* Keep old restaurant images hidden for this clean card style */
    .lux-page-dining .lux-restaurant-media,
    .lux-page-dining .lux-restaurant-scrim{
        display:none !important;
    }


    /* ============================
       CARD INNER LAYOUT
       ============================ */

    .lux-page-dining .lux-restaurant-body{
        position:relative !important;

        width:100% !important;
        min-height:132px !important;
        height:auto !important;

        padding:16px 17px !important;
        margin:0 !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        background:transparent !important;
    }

    .lux-page-dining .lux-restaurant-info{
        width:100% !important;
        min-width:0 !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:flex-start !important;
        justify-content:center !important;

        text-align:start !important;
    }


    /* Cards WITH opening hours */
    .lux-page-dining
    .lux-restaurant-info:has(.lux-dining-hours-card){

        display:grid !important;

        grid-template-columns:
            minmax(105px,.80fr)
            minmax(190px,1.20fr) !important;

        grid-template-areas:
            "tag hours"
            "name hours";

        column-gap:14px !important;
        row-gap:5px !important;

        align-items:center !important;
    }


    /* ============================
       RESTAURANT IDENTITY
       ============================ */

    .lux-page-dining .lux-restaurant-tag{
        grid-area:tag;

        display:block !important;

        margin:0 !important;

        font-family:var(--lux-font-sans) !important;
        font-size:7px !important;
        font-weight:800 !important;
        line-height:1 !important;

        letter-spacing:.16em !important;
        text-transform:uppercase !important;

        color:#a87829 !important;
    }


    .lux-page-dining .lux-restaurant-name{
        grid-area:name;

        display:block !important;

        margin:0 !important;
        padding:0 !important;

        font-family:var(--lux-font-display) !important;
        font-size:20px !important;
        font-weight:700 !important;
        line-height:1.02 !important;

        letter-spacing:.015em !important;

        color:#102d4f !important;
        text-align:start !important;
        text-shadow:none !important;

        white-space:normal !important;
    }


    /* Keep long description away on mobile */
    .lux-page-dining .lux-restaurant-desc{
        display:none !important;
    }


    /* Restaurant with no schedule yet */
    .lux-page-dining
    .lux-restaurant-info:not(:has(.lux-dining-hours-card)){
        align-items:center !important;
        text-align:center !important;
    }

    .lux-page-dining
    .lux-restaurant-info:not(:has(.lux-dining-hours-card))
    .lux-restaurant-tag,
    .lux-page-dining
    .lux-restaurant-info:not(:has(.lux-dining-hours-card))
    .lux-restaurant-name{
        text-align:center !important;
    }

    .lux-page-dining
    .lux-restaurant-info:not(:has(.lux-dining-hours-card))
    .lux-restaurant-name{
        font-size:23px !important;
    }


    /* ============================
       OPENING HOURS SIDE PANEL
       ============================ */

    .lux-page-dining .lux-dining-hours-card{
        grid-area:hours;

        width:100% !important;
        min-width:0 !important;
        max-width:none !important;

        margin:0 !important;
        padding:10px 11px !important;

        display:grid !important;
        gap:6px !important;

        background:
            linear-gradient(
                135deg,
                rgba(185,134,47,.055),
                rgba(255,255,255,.34)
            ) !important;

        border:1px solid rgba(185,134,47,.30) !important;
        border-radius:11px !important;
    }


    .lux-page-dining .lux-dining-hours-title{
        display:block !important;

        margin:0 0 2px 0 !important;

        font-family:var(--lux-font-sans) !important;
        font-size:7px !important;
        font-weight:800 !important;
        line-height:1.1 !important;

        letter-spacing:.13em !important;
        text-transform:uppercase !important;

        color:#99691e !important;
    }


    /* ============================
       EACH MEAL
       ============================ */

    .lux-page-dining .lux-dining-hours-row{
        width:100% !important;
        min-width:0 !important;

        display:grid !important;

        grid-template-columns:
            6px
            minmax(58px,.8fr)
            minmax(92px,1.2fr) !important;

        align-items:center !important;
        gap:6px !important;

        padding:1px 0 !important;

        line-height:1.1 !important;
    }


    .lux-page-dining .lux-dining-hours-current-dot{
        width:5px !important;
        height:5px !important;

        border-radius:50% !important;

        background:#c39a51 !important;

        box-shadow:none !important;
    }


    /* Current meal */
    .lux-page-dining
    .lux-dining-hours-row.is-current
    .lux-dining-hours-current-dot{

        background:#45bd72 !important;

        box-shadow:
            0 0 0 2px rgba(69,189,114,.10),
            0 0 6px rgba(69,189,114,.55) !important;
    }


    .lux-page-dining .lux-dining-hours-row strong{
        min-width:0 !important;

        font-family:var(--lux-font-sans) !important;
        font-size:8px !important;
        font-weight:800 !important;
        line-height:1.1 !important;

        letter-spacing:.055em !important;
        text-transform:uppercase !important;

        color:#173755 !important;

        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }


    .lux-page-dining
    .lux-dining-hours-row > span:last-child{

        min-width:0 !important;

        font-family:var(--lux-font-sans) !important;
        font-size:8px !important;
        font-weight:700 !important;
        line-height:1.1 !important;

        letter-spacing:-.015em !important;

        font-variant-numeric:tabular-nums !important;

        color:#40566a !important;

        white-space:nowrap !important;
        text-align:end !important;
    }


    .lux-page-dining
    .lux-dining-hours-row.is-current strong,
    .lux-page-dining
    .lux-dining-hours-row.is-current > span:last-child{

        color:#102d4f !important;
        font-weight:800 !important;
    }


    /* ============================
       CLOSED STATE
       ============================ */

    .lux-page-dining .lux-dining-hours-closed{
        display:flex !important;
        align-items:center !important;

        gap:7px !important;

        font-size:9px !important;
        font-weight:700 !important;

        color:#173755 !important;
    }


    .lux-page-dining .lux-dining-hours-red-dot{
        width:6px !important;
        height:6px !important;

        flex:0 0 6px !important;

        border-radius:50% !important;

        background:#d65252 !important;

        box-shadow:
            0 0 5px rgba(214,82,82,.36) !important;
    }


    /* No arrow inside selection cards */
    .lux-page-dining .lux-btn-circle{
        display:none !important;
    }


    /* ============================
       VERY SMALL PHONES
       ============================ */

    @media(max-width:390px){

        .lux-page-dining
        .lux-restaurant-info:has(.lux-dining-hours-card){

            grid-template-columns:
                minmax(88px,.70fr)
                minmax(175px,1.30fr) !important;

            column-gap:9px !important;
        }

        .lux-page-dining .lux-restaurant-name{
            font-size:17px !important;
        }

        .lux-page-dining .lux-dining-hours-card{
            padding:9px 8px !important;
        }

        .lux-page-dining .lux-dining-hours-row{
            gap:4px !important;

            grid-template-columns:
                5px
                minmax(52px,.8fr)
                minmax(88px,1.2fr) !important;
        }

        .lux-page-dining .lux-dining-hours-row strong{
            font-size:7.4px !important;
        }

        .lux-page-dining
        .lux-dining-hours-row > span:last-child{
            font-size:7.3px !important;
        }
    }
}

/* END LUXOTEL DINING FINAL MOBILE V3 */


/* LUXOTEL HIDE CATEGORY DURING CONTACT MODAL */
@media (max-width:720px){

  /* Contact / Feedback above all floating menu controls */
  #luxContactModal.open,
  #luxFeedbackModal.open{
    z-index:20000!important;
  }

  /*
   Hide ONLY the category strip while Contact
   or Feedback is open.
  */
  body:has(#luxContactModal.open)
    .lux-mobile-category-clone,

  body:has(#luxFeedbackModal.open)
    .lux-mobile-category-clone,

  body:has(#luxContactModal.open)
    > .lux-category-dock.lux-mobile-category-dock,

  body:has(#luxFeedbackModal.open)
    > .lux-category-dock.lux-mobile-category-dock,

  body:has(#luxContactModal.open)
    .lux-category-dock,

  body:has(#luxFeedbackModal.open)
    .lux-category-dock{

    display:none!important;
  }

}
/* END LUXOTEL HIDE CATEGORY DURING CONTACT MODAL */


/* LUXOTEL AQABA CMS CARD WIDTHS */

/*
 Aqaba landing card layout is controlled by Admin:
 Full = 118px
 Half = 96px
*/

.lux-restaurant-media > video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

@media (max-width:650px){

  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-dining-grid
  > .lux-restaurant-card.lux-card-width-full{

    grid-column:1 / -1!important;

    height:118px!important;
    min-height:118px!important;
    max-height:118px!important;
  }

  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-dining-grid
  > .lux-restaurant-card.lux-card-width-half{

    grid-column:auto!important;

    height:96px!important;
    min-height:96px!important;
    max-height:96px!important;
  }

}

/* END LUXOTEL AQABA CMS CARD WIDTHS */


/* LUXOTEL RTL CATEGORY DIRECTION V1 */

/*
 * Category navigation must follow the document language.
 * No dimensions / colors / positioning are changed here.
 */

html[dir="rtl"] .lux-category-dock,
html[dir="rtl"] .lux-mobile-category-clone{
  direction:rtl!important;
}

html[dir="ltr"] .lux-category-dock,
html[dir="ltr"] .lux-mobile-category-clone{
  direction:ltr!important;
}

/* Keep category text itself naturally aligned */
html[dir="rtl"] .lux-category-dock .lux-cat-pill,
html[dir="rtl"] .lux-mobile-category-clone .lux-cat-pill{
  direction:rtl!important;
  unicode-bidi:plaintext;
}

/* END LUXOTEL RTL CATEGORY DIRECTION V1 */
/* ==========================================================
   LUXOTEL DESKTOP FOUNDATION G1 V1
   Desktop only. Mobile / tablet rules remain untouched.
   ========================================================== */

@media (min-width:1025px){

  /* ------------------------------------------
     GLOBAL DESKTOP CONTENT WIDTH
     ------------------------------------------ */

  .lux-container{
    width:min(1180px,calc(100% - 64px));
    margin-left:auto;
    margin-right:auto;
  }


  /* ------------------------------------------
     PROPERTY INTRO
     ------------------------------------------ */

  .lux-property-intro{
    max-width:900px;
    margin-left:auto;
    margin-right:auto;
  }


  /* ------------------------------------------
     AQABA / WADI LANDING CARDS
     ------------------------------------------ */

  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-dining-grid,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-dining-grid{
    display:grid!important;

    grid-template-columns:
      repeat(auto-fit,minmax(300px,1fr))!important;

    gap:22px!important;

    width:100%!important;
    max-width:1180px!important;

    margin:28px auto 42px!important;
  }


  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-restaurant-card,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-restaurant-card{
    height:300px!important;
    min-height:300px!important;
    max-height:300px!important;

    margin:0!important;
    border-radius:20px!important;
  }


  /* ------------------------------------------
     DINING LANDING
     ------------------------------------------ */

  .lux-page-dining .lux-menu-header{
    max-width:900px;
    margin-left:auto;
    margin-right:auto;

    padding:50px 24px 32px;

    text-align:center;
  }


  .lux-page-dining .lux-dining-grid{
    display:grid!important;

    grid-template-columns:
      repeat(auto-fit,minmax(280px,1fr))!important;

    gap:22px!important;

    width:100%!important;
    max-width:1180px!important;

    margin:28px auto 40px!important;
  }


  .lux-page-dining .lux-restaurant-card{
    height:320px!important;
    min-height:320px!important;
    max-height:320px!important;

    padding:24px!important;

    border-radius:20px!important;
  }


  .lux-page-dining .lux-restaurant-body{
    padding:0!important;
  }


  /* ------------------------------------------
     MENU ITEMS
     ------------------------------------------ */

  .lux-items-grid,
  .items-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:20px 28px;
  }


  /* ------------------------------------------
     PROPERTY HOME BUILDER CARDS
     Keep builder column choices.
     Only center and constrain the workspace.
     ------------------------------------------ */

  .v12-property
  [data-v10-element="choices"]{
    width:100%!important;
    max-width:1120px!important;

    margin-left:auto!important;
    margin-right:auto!important;

    align-items:stretch;
  }


  /* ------------------------------------------
     DESKTOP FOOTER BREATHING ROOM
     ------------------------------------------ */

  body.lux-site-aqaba .lux-footer,
  body.lux-site-wadi-rum .lux-footer{
    margin-top:48px;
  }

}

/* END LUXOTEL DESKTOP FOUNDATION G1 V1 */
/* ==========================================================
   LUXOTEL DESKTOP POLISH G2 V1
   Desktop only - mobile remains frozen
   ========================================================== */

@media (min-width:1025px){

  /* ------------------------------------------
     PROPERTY LANDING INTRO
     ------------------------------------------ */

  body.lux-site-aqaba:not(.lux-page-dining)
  main.lux-container > .lux-property-intro,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  main.lux-container > .lux-property-intro{
    max-width:900px!important;
    margin:0 auto 18px!important;
    padding:34px 20px 18px!important;
  }


  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-property-intro-title,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-property-intro-title{
    line-height:1!important;
  }


  /* ------------------------------------------
     AQABA / WADI HOME CARDS
     Four balanced cards when space allows
     ------------------------------------------ */

  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-dining-grid,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-dining-grid{
    grid-template-columns:
      repeat(auto-fit,minmax(240px,1fr))!important;

    gap:20px!important;

    margin-top:20px!important;
    margin-bottom:38px!important;
  }


  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-restaurant-card,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-restaurant-card{
    height:270px!important;
    min-height:270px!important;
    max-height:270px!important;
  }


  /* Better image-card readability */

  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-restaurant-tag,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-restaurant-tag{
    color:#d9ad5d!important;
    text-shadow:0 2px 8px rgba(0,0,0,.55)!important;
  }


  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-restaurant-name,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-restaurant-name{
    color:#fffaf0!important;
    text-shadow:0 3px 14px rgba(0,0,0,.65)!important;
  }


  body.lux-site-aqaba:not(.lux-page-dining)
  .lux-restaurant-desc,

  body.lux-site-wadi-rum:not(.lux-page-dining)
  .lux-restaurant-desc{
    color:rgba(255,255,255,.88)!important;
    text-shadow:0 2px 8px rgba(0,0,0,.55)!important;
  }


  /* ------------------------------------------
     DINING LANDING
     ------------------------------------------ */

  .lux-page-dining .lux-menu-header{
    padding:36px 24px 22px!important;
  }


  .lux-page-dining .lux-dining-grid{
    grid-template-columns:
      repeat(3,minmax(0,1fr))!important;

    gap:20px!important;

    margin-top:22px!important;
    margin-bottom:34px!important;
  }


  .lux-page-dining .lux-restaurant-card{
    height:290px!important;
    min-height:290px!important;
    max-height:290px!important;

    padding:22px!important;
  }


  .lux-page-dining .lux-restaurant-tag{
    color:#d9ad5d!important;
    text-shadow:0 2px 8px rgba(0,0,0,.65)!important;
  }


  .lux-page-dining .lux-restaurant-name{
    color:#fffaf0!important;
    text-shadow:0 3px 14px rgba(0,0,0,.72)!important;
  }


  .lux-page-dining .lux-restaurant-desc{
    color:rgba(255,255,255,.9)!important;
    text-shadow:0 2px 8px rgba(0,0,0,.65)!important;
  }


  .lux-page-dining .lux-dining-hours-card,
  .lux-page-dining .lux-dining-hours-card *{
    text-shadow:0 2px 7px rgba(0,0,0,.6);
  }


  /* ------------------------------------------
     MENU PAGE TOOLBAR
     Prevent desktop category clipping
     ------------------------------------------ */

  body.lux-unified-menu-page
  .lux-menu-toolbar-wrap{
    overflow:visible!important;
    margin-bottom:24px!important;
  }


  body.lux-unified-menu-page
  .lux-menu-toolbar-inner{
    display:flex!important;
    flex-wrap:wrap!important;

    align-items:center!important;
    justify-content:flex-start!important;

    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;

    gap:8px 10px!important;
    padding:8px 10px!important;

    overflow:visible!important;
  }


  body.lux-unified-menu-page
  .lux-menu-toolbar-inner > *{
    min-width:0;
  }


  /* ------------------------------------------
     MENU CONTENT
     ------------------------------------------ */

  body.lux-unified-menu-page
  .lux-items-grid,

  body.lux-unified-menu-page
  .items-grid{
    gap:18px 22px!important;
  }

}

/* END LUXOTEL DESKTOP POLISH G2 V1 */
/* ==========================================================
   LUXOTEL RESPONSIVE HERO H1 V1
   Heroes are page sections, not cards.
   Whole cards are clickable; decorative arrows removed.
   ========================================================== */


/* ----------------------------------------------------------
   CARD ACTION
   ---------------------------------------------------------- */

.lux-restaurant-card,
.v12-property [data-v10-element="choices"] .choice{
    cursor:pointer;
}

.lux-restaurant-card .arrow,
.lux-restaurant-card .lux-card-arrow,
.lux-restaurant-card .choice-arrow,
.v12-property [data-v10-element="choices"] .choice .arrow{
    display:none!important;
}


/* ----------------------------------------------------------
   DESKTOP HERO
   Full viewport width while keeping inner content centered.
   ---------------------------------------------------------- */

@media (min-width:1025px){

    body.lux-unified-menu-page
    main.lux-container
    .lux-hero.lux-menu-identity,

    body.lux-site-aqaba
    main.lux-container
    .lux-hero.lux-menu-identity,

    body.lux-site-wadi-rum
    main.lux-container
    .lux-hero.lux-menu-identity{

        width:100vw!important;
        max-width:100vw!important;

        margin-left:calc(50% - 50vw)!important;
        margin-right:calc(50% - 50vw)!important;

        border-left:0!important;
        border-right:0!important;
        border-radius:0!important;

        box-shadow:none!important;
    }


    body.lux-unified-menu-page
    .lux-hero.lux-menu-identity
    > .lux-hero-media,

    body.lux-site-aqaba
    .lux-hero.lux-menu-identity
    > .lux-hero-media,

    body.lux-site-wadi-rum
    .lux-hero.lux-menu-identity
    > .lux-hero-media{

        border-radius:0!important;
    }


    body.lux-unified-menu-page
    .lux-hero.lux-menu-identity
    > .lux-hero-media img,

    body.lux-unified-menu-page
    .lux-hero.lux-menu-identity
    > .lux-hero-media video,

    body.lux-site-aqaba
    .lux-hero.lux-menu-identity
    > .lux-hero-media img,

    body.lux-site-aqaba
    .lux-hero.lux-menu-identity
    > .lux-hero-media video,

    body.lux-site-wadi-rum
    .lux-hero.lux-menu-identity
    > .lux-hero-media img,

    body.lux-site-wadi-rum
    .lux-hero.lux-menu-identity
    > .lux-hero-media video{

        width:100%!important;
        height:100%!important;

        border-radius:0!important;

        object-fit:cover!important;
    }

}


/* Subtle desktop feedback - the CARD itself is the button */

@media (min-width:1025px) and (hover:hover){

    .lux-restaurant-card,
    .v12-property [data-v10-element="choices"] .choice{
        transition:
            transform .18s ease,
            box-shadow .18s ease!important;
    }

    .lux-restaurant-card:hover,
    .v12-property [data-v10-element="choices"] .choice:hover{
        transform:translateY(-3px)!important;
    }
}

/* END LUXOTEL RESPONSIVE HERO H1 V1 */
/* ==========================================================
   LUXOTEL INTERNAL CARD ARROW H1.1 V1
   Whole anchor card remains clickable.
   Decorative circle arrow removed.
   ========================================================== */

.lux-restaurant-card > .lux-btn-circle,
.lux-restaurant-card .lux-btn-circle{
    display:none!important;
}

/* END LUXOTEL INTERNAL CARD ARROW H1.1 V1 */
/* ==========================================================
   LUXOTEL ADMIN MEDIA PLACEHOLDER M1 V1

   Content photography is Admin-owned.
   Empty cards use a neutral Luxotel brand placeholder.
   ========================================================== */

.lux-media-placeholder,
.lux-restaurant-media:empty,
.lux-portal-v2-card-media:empty{
    width:100%;
    height:100%;
    min-height:100%;

    display:block;

    background-color:#0d2a47!important;

    background-image:
        url('luxotel-logo-gold-safe.png'),
        linear-gradient(
            135deg,
            rgba(7,30,51,.98),
            rgba(18,57,91,.96)
        )!important;

    background-repeat:
        no-repeat,
        no-repeat!important;

    background-position:
        center,
        center!important;

    background-size:
        72px auto,
        cover!important;
}


/* Gallery placeholder returned when no canonical media exists. */

.lux-portal-v2-card-media > .lux-media-placeholder{
    position:absolute;
    inset:0;
}


/* Legacy property cards with no image receive the same neutral base. */

.v12-property [data-v10-element="choices"] .choice{
    background-color:#0d2a47;
}


/* Hero remains elegant even when Admin intentionally removes media. */

.lux-hero.lux-menu-identity{
    background-color:#0d2a47;
    background-image:
        linear-gradient(
            135deg,
            #0b2844,
            #173d61
        );
}

/* END LUXOTEL ADMIN MEDIA PLACEHOLDER M1 V1 */


/* =========================================================
   LUXOTEL MOBILE DINING IMAGES M1.2 V1
   Use the same Admin-owned restaurant media on mobile.
   ========================================================= */

@media (max-width:650px){

    .lux-page-dining .lux-restaurant-card{
        position:relative!important;

        height:118px!important;
        min-height:118px!important;
        max-height:118px!important;

        padding:0!important;
        overflow:hidden!important;

        background:#102d4f!important;
        border-radius:10px!important;
    }


    .lux-page-dining .lux-restaurant-media{
        display:block!important;

        position:absolute!important;
        inset:0!important;

        width:100%!important;
        height:100%!important;

        z-index:0!important;

        background-size:cover!important;
        background-position:center!important;
        background-repeat:no-repeat!important;

        overflow:hidden!important;
    }


    .lux-page-dining .lux-restaurant-media img,
    .lux-page-dining .lux-restaurant-media picture,
    .lux-page-dining .lux-restaurant-media video{
        display:block!important;

        width:100%!important;
        height:100%!important;

        object-fit:cover!important;
        object-position:center!important;
    }


    .lux-page-dining .lux-restaurant-scrim{
        display:block!important;

        position:absolute!important;
        inset:0!important;

        z-index:1!important;

        background:
            linear-gradient(
                to top,
                rgba(5,24,42,.78) 0%,
                rgba(5,24,42,.35) 48%,
                rgba(5,24,42,.06) 100%
            )!important;

        pointer-events:none!important;
    }


    .lux-page-dining .lux-restaurant-body{
        position:absolute!important;
        inset:0!important;

        z-index:2!important;

        width:100%!important;
        height:100%!important;

        padding:9px 6px!important;

        display:flex!important;
        align-items:flex-end!important;
        justify-content:center!important;

        background:transparent!important;
    }


    .lux-page-dining .lux-restaurant-info{
        width:100%!important;

        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        justify-content:flex-end!important;

        text-align:center!important;
    }


    .lux-page-dining .lux-restaurant-name{
        margin:0!important;
        padding:0 3px!important;

        color:#fff!important;

        font:700 11px/1.15 Arial,sans-serif!important;
        letter-spacing:.035em!important;

        text-align:center!important;

        text-shadow:
            0 1px 3px rgba(0,0,0,.75)!important;
    }


    .lux-page-dining .lux-restaurant-tag,
    .lux-page-dining .lux-restaurant-desc,
    .lux-page-dining .lux-btn-circle{
        display:none!important;
    }

}

/* END LUXOTEL MOBILE DINING IMAGES M1.2 V1 */


/* LUXOTEL DINING MOBILE FINAL H6 START */

@media (max-width:720px){

    /* =====================================================
       UNIFIED CARD SIZE
       ===================================================== */

    .lux-page-dining .lux-dining-grid{
        display:grid!important;
        grid-template-columns:1fr!important;

        gap:12px!important;

        width:calc(100% - 18px)!important;
        margin:18px auto 24px!important;
        padding:0!important;
    }


    .lux-page-dining .lux-restaurant-card{
        position:relative!important;

        width:100%!important;

        height:138px!important;
        min-height:138px!important;
        max-height:138px!important;

        margin:0!important;
        padding:0!important;

        overflow:hidden!important;
        isolation:isolate!important;

        border:1px solid rgba(190,143,57,.70)!important;
        border-radius:17px!important;

        background:#081a2c!important;

        box-shadow:
            0 7px 18px rgba(5,22,38,.10)!important;
    }


    /* =====================================================
       IMAGE
       ===================================================== */

    .lux-page-dining .lux-restaurant-media{
        display:block!important;

        position:absolute!important;
        inset:0!important;

        z-index:0!important;

        width:100%!important;
        height:100%!important;
    }


    .lux-page-dining .lux-restaurant-media img,
    .lux-page-dining .lux-restaurant-media video{
        display:block!important;

        width:100%!important;
        height:100%!important;

        object-fit:cover!important;
        object-position:center!important;

        transform:none!important;

        filter:
            brightness(.72)
            saturate(.90)
            contrast(1.02)!important;
    }


    /* =====================================================
       CONTROLLED SCRIM
       Keeps every image from disturbing text.
       ===================================================== */

    .lux-page-dining .lux-restaurant-scrim{
        display:block!important;

        position:absolute!important;
        inset:0!important;

        z-index:1!important;

        background:
            linear-gradient(
                90deg,
                rgba(5,20,35,.52) 0%,
                rgba(5,20,35,.20) 43%,
                rgba(5,20,35,.14) 100%
            ),
            linear-gradient(
                0deg,
                rgba(5,19,33,.88) 0%,
                rgba(5,19,33,.34) 42%,
                rgba(5,19,33,.08) 76%
            )!important;

        pointer-events:none!important;
    }


    /* =====================================================
       CONTENT FOUNDATION
       Remove old grid / centering conflicts.
       ===================================================== */

    .lux-page-dining .lux-restaurant-body{
        position:absolute!important;
        inset:0!important;

        z-index:2!important;

        display:block!important;

        width:100%!important;
        height:100%!important;

        padding:0!important;
        margin:0!important;
    }


    .lux-page-dining .lux-restaurant-info,
    .lux-page-dining
    .lux-restaurant-info:has(.lux-dining-hours-card){

        position:absolute!important;
        inset:0!important;

        width:100%!important;
        height:100%!important;

        display:block!important;

        margin:0!important;
        padding:0!important;

        text-align:left!important;
    }


    .lux-page-dining .lux-restaurant-tag,
    .lux-page-dining .lux-restaurant-desc,
    .lux-page-dining .lux-btn-circle{
        display:none!important;
    }


    /* =====================================================
       RESTAURANT NAME
       Luxury ornamental typography
       ===================================================== */

    .lux-page-dining
    .lux-restaurant-card
    .lux-restaurant-name{

        display:block!important;

        position:absolute!important;
        left:13px!important;
        bottom:11px!important;

        z-index:6!important;

        width:auto!important;
        max-width:calc(100% - 26px)!important;

        margin:0!important;
        padding:4px 10px 5px 11px!important;

        overflow:visible!important;

        color:#fffaf0!important;

        font-family:
            'Cormorant Garamond',
            'Playfair Display',
            Georgia,
            serif!important;

        font-size:clamp(20px,6.2vw,24px)!important;
        font-weight:600!important;
        font-style:normal!important;

        line-height:.98!important;
        letter-spacing:.025em!important;

        white-space:normal!important;
        text-align:left!important;

        text-shadow:
            0 2px 7px rgba(0,0,0,.74),
            0 0 18px rgba(0,0,0,.28)!important;

        background:
            linear-gradient(
                90deg,
                rgba(5,22,39,.82),
                rgba(5,22,39,.52),
                rgba(5,22,39,0)
            )!important;

        border-left:
            2px solid rgba(218,177,92,.92)!important;

        border-radius:2px 9px 9px 2px!important;
    }


    /* Cards with hours reserve room on the right. */

    .lux-page-dining
    .lux-restaurant-card:has(.lux-dining-hours-card)
    .lux-restaurant-name{
        max-width:39%!important;
    }


    /* Arabic keeps its proper luxury Arabic font. */

    html[dir="rtl"]
    .lux-page-dining
    .lux-restaurant-card
    .lux-restaurant-name{

        left:auto!important;
        right:13px!important;

        font-family:var(--lux-font-arabic)!important;

        text-align:right!important;

        border-left:0!important;
        border-right:
            2px solid rgba(218,177,92,.92)!important;

        background:
            linear-gradient(
                270deg,
                rgba(5,22,39,.82),
                rgba(5,22,39,.52),
                rgba(5,22,39,0)
            )!important;
    }


    /* =====================================================
       ACTUAL DINING HOURS BOX
       IMPORTANT: these are the real frontend classes.
       ===================================================== */

    .lux-page-dining
    .lux-restaurant-card
    .lux-dining-hours-card{

        display:block!important;

        position:absolute!important;

        top:10px!important;
        right:10px!important;

        z-index:7!important;

        width:58%!important;
        min-width:166px!important;
        max-width:196px!important;

        margin:0!important;
        padding:8px 9px 9px!important;

        overflow:hidden!important;

        color:#ffffff!important;

        background:
            rgba(7,24,42,.91)!important;

        border:
            1px solid rgba(216,175,91,.74)!important;

        border-radius:12px!important;

        box-shadow:
            0 8px 22px rgba(0,0,0,.24),
            inset 0 0 0 1px rgba(255,255,255,.035)!important;

        backdrop-filter:blur(6px)!important;
        -webkit-backdrop-filter:blur(6px)!important;

        text-align:left!important;
    }


    html[dir="rtl"]
    .lux-page-dining
    .lux-restaurant-card
    .lux-dining-hours-card{

        right:auto!important;
        left:10px!important;

        text-align:right!important;
    }


    /* =====================================================
       HOURS HEADING
       ===================================================== */

    .lux-page-dining
    .lux-dining-hours-title{

        display:block!important;

        margin:0 0 5px!important;
        padding:0 0 5px!important;

        color:#e5c474!important;

        font-family:var(--lux-font-sans)!important;

        font-size:9px!important;
        font-weight:800!important;

        line-height:1!important;

        letter-spacing:.12em!important;
        text-transform:uppercase!important;

        border-bottom:
            1px solid rgba(216,175,91,.34)!important;

        text-shadow:none!important;
    }


    /* =====================================================
       HOURS ROW
       dot | period | time
       ===================================================== */

    .lux-page-dining
    .lux-dining-hours-row{

        display:grid!important;

        grid-template-columns:
            6px
            minmax(54px,.8fr)
            minmax(88px,1.25fr)!important;

        align-items:center!important;

        width:100%!important;
        min-width:0!important;

        gap:5px!important;

        margin:0!important;
        padding:3px 0!important;

        line-height:1.15!important;

        border:0!important;
    }


    .lux-page-dining
    .lux-dining-hours-row + .lux-dining-hours-row{

        border-top:
            1px solid rgba(255,255,255,.09)!important;
    }


    /* BREAKFAST / DINNER / FOOD */

    .lux-page-dining
    .lux-dining-hours-row strong{

        display:block!important;

        min-width:0!important;

        color:#f0dba8!important;

        font-family:var(--lux-font-sans)!important;

        font-size:9px!important;
        font-weight:700!important;

        line-height:1.15!important;
        letter-spacing:.035em!important;

        white-space:nowrap!important;

        text-shadow:none!important;
    }


    /* 7:00 PM - 10:30 PM */

    .lux-page-dining
    .lux-dining-hours-row > span:last-child{

        display:block!important;

        min-width:0!important;

        color:#ffffff!important;

        font-family:var(--lux-font-sans)!important;

        font-size:9.5px!important;
        font-weight:700!important;

        line-height:1.15!important;
        letter-spacing:0!important;

        text-align:right!important;
        white-space:nowrap!important;

        text-shadow:none!important;
    }


    html[dir="rtl"]
    .lux-page-dining
    .lux-dining-hours-row > span:last-child{

        text-align:left!important;
    }


    /* status dot */

    .lux-page-dining
    .lux-dining-hours-current-dot{

        display:block!important;

        width:5px!important;
        height:5px!important;

        min-width:5px!important;
        min-height:5px!important;

        border-radius:50%!important;

        box-shadow:
            0 0 0 2px rgba(82,208,125,.12),
            0 0 6px rgba(82,208,125,.48)!important;
    }


    /* =====================================================
       REMOVE OLD SMALL-SCREEN FONT SHRINK
       ===================================================== */

    @media(max-width:390px){

        .lux-page-dining
        .lux-restaurant-card
        .lux-restaurant-name{

            font-size:21px!important;
        }


        .lux-page-dining
        .lux-restaurant-card
        .lux-dining-hours-card{

            width:59%!important;
            min-width:164px!important;
            max-width:190px!important;

            padding:7px 8px 8px!important;
        }


        .lux-page-dining
        .lux-dining-hours-title{

            font-size:8.5px!important;
        }


        .lux-page-dining
        .lux-dining-hours-row strong{

            font-size:8.7px!important;
        }


        .lux-page-dining
        .lux-dining-hours-row > span:last-child{

            font-size:9px!important;
        }
    }

}

/* LUXOTEL DINING MOBILE FINAL H6 END */


/* LUXOTEL DINING HOURS H6.1 START */

@media (max-width:720px){

    /* Keep Dining Hours heading gold */
    .lux-page-dining
    .lux-dining-hours-title{
        color:#e5c474!important;
    }


    /* Period names: BREAKFAST / DINNER / FOOD */
    .lux-page-dining
    .lux-dining-hours-row strong{
        color:#ffffff!important;
        font-weight:700!important;
        text-shadow:none!important;
    }


    /* Opening / closing times */
    .lux-page-dining
    .lux-dining-hours-row > span:last-child{
        color:#ffffff!important;
        font-weight:700!important;
        text-shadow:none!important;
    }


    /* Default / closed period dot */
    .lux-page-dining
    .lux-dining-hours-current-dot{
        width:8px!important;
        height:8px!important;

        min-width:8px!important;
        min-height:8px!important;

        display:block!important;

        padding:0!important;
        margin:0!important;

        border:0!important;
        border-radius:50%!important;

        background:#d94b4b!important;

        box-shadow:
            0 0 0 2px rgba(217,75,75,.14)!important;
    }


    /* Current/open period remains green */
    .lux-page-dining
    .lux-dining-hours-row.is-current
    .lux-dining-hours-current-dot,
    .lux-page-dining
    .lux-dining-hours-current-dot.is-current,
    .lux-page-dining
    .lux-dining-hours-row.current
    .lux-dining-hours-current-dot{
        background:#45bd72!important;

        box-shadow:
            0 0 0 2px rgba(69,189,114,.14)!important;
    }

}

/* LUXOTEL DINING HOURS H6.1 END */


/* LUXOTEL DINING HOURS H6.2 START */

@media (max-width:720px){

    /* ---------------------------------------------------------
       Hours title keeps the Luxotel gold.
       --------------------------------------------------------- */

    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-title{
        color:#e5c474!important;
    }


    /* ---------------------------------------------------------
       EVERY schedule text below the title is pure white.
       Overrides all old navy / grey rules.
       --------------------------------------------------------- */

    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-row,

    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-row strong,

    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-row span:not(.lux-dining-hours-current-dot):not(.lux-dining-hours-red-dot){

        color:#ffffff!important;

        opacity:1!important;

        -webkit-text-fill-color:#ffffff!important;

        text-shadow:none!important;
    }


    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-row strong{

        font-weight:750!important;
    }


    .lux-page-dining
    .lux-dining-hours-card
    .lux-dining-hours-row > span:last-child{

        color:#ffffff!important;

        -webkit-text-fill-color:#ffffff!important;

        font-weight:750!important;
    }


    /* ---------------------------------------------------------
       Status dots
       Default = CLOSED / red.
       --------------------------------------------------------- */

    .lux-page-dining
    .lux-dining-hours-current-dot,

    .lux-page-dining
    .lux-dining-hours-red-dot{

        display:block!important;

        width:9px!important;
        height:9px!important;

        min-width:9px!important;
        min-height:9px!important;

        flex:0 0 9px!important;

        padding:0!important;
        margin:0!important;

        border:0!important;
        border-radius:50%!important;

        background:#e04f57!important;

        box-shadow:none!important;

        opacity:1!important;
    }


    /* OPEN period */

    .lux-page-dining
    .lux-dining-hours-row.lux-hours-is-open
    .lux-dining-hours-current-dot,

    .lux-page-dining
    .lux-dining-hours-row.lux-hours-is-open
    .lux-dining-hours-red-dot{

        background:#45bd72!important;

        box-shadow:
            0 0 0 2px rgba(69,189,114,.13)!important;
    }


    /* CLOSED period */

    .lux-page-dining
    .lux-dining-hours-row.lux-hours-is-closed
    .lux-dining-hours-current-dot,

    .lux-page-dining
    .lux-dining-hours-row.lux-hours-is-closed
    .lux-dining-hours-red-dot{

        background:#e04f57!important;

        box-shadow:none!important;
    }


    /* Keep rows visually consistent after reordering */

    .lux-page-dining
    .lux-dining-hours-row{

        position:relative!important;

        opacity:1!important;
    }


    .lux-page-dining
    .lux-dining-hours-row.lux-hours-is-open{

        order:-10!important;
    }

}

/* LUXOTEL DINING HOURS H6.2 END */
