/* ==========================================================================
   LE SNACK BOUSHABA — LUXURY THEME & STYLE ENHANCEMENT
   Conserves 100% of the original logo, pink (#E91E8C / #FF5AAE) and dark theme.
   Elevates aesthetics, textures, cards, lighting, typography and animations.
   ========================================================================== */

:root {
  --bb-pink: #E91E8C;
  --bb-pink-light: #FF5AAE;
  --bb-pink-glow: rgba(233, 30, 140, 0.45);
  --bb-pink-subtle: rgba(233, 30, 140, 0.12);
  --bb-dark: #0D0D12;
  --bb-dark-surface: #14141B;
  --bb-dark-elevated: #1B1B24;
  --bb-gold: #FFB703;
  --bb-gold-glow: rgba(255, 183, 3, 0.35);
  --bb-text: #FFFFFF;
  --bb-muted: #A1A1AA;
}

/* Smooth Scrolling & Typography Rendering */
html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background-color: var(--bb-dark) !important;
  color: var(--bb-text);
  overflow-x: hidden;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 9px;
}
::-webkit-scrollbar-track {
  background: #09090D;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--bb-pink) 0%, #9C145B 100%);
  border-radius: 999px;
  border: 2px solid #09090D;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--bb-pink-light);
}

/* --------------------------------------------------------------------------
   1. NAVBAR & LOGO ENHANCEMENT
   -------------------------------------------------------------------------- */
header, nav {
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  background-color: rgba(13, 13, 18, 0.85) !important;
  border-bottom: 1px solid rgba(233, 30, 140, 0.2) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7) !important;
  transition: all 0.3s ease !important;
}

/* Logo BB Boushaba Ring Glow */
img[src*="logo-boushaba"] {
  filter: drop-shadow(0 0 16px rgba(233, 30, 140, 0.5)) !important;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.35s ease !important;
}

img[src*="logo-boushaba"]:hover {
  transform: scale(1.06) rotate(2deg) !important;
  filter: drop-shadow(0 0 24px rgba(255, 90, 174, 0.8)) !important;
}

/* Nav Links hover effect */
nav a:not([class*="bg-"]):hover {
  color: var(--bb-pink-light) !important;
  text-shadow: 0 0 12px rgba(233, 30, 140, 0.6);
}

/* --------------------------------------------------------------------------
   2. HERO SECTION & CALL TO ACTIONS
   -------------------------------------------------------------------------- */
/* Hero ambient lighting background */
section:first-of-type {
  position: relative;
}

section:first-of-type::before {
  content: '';
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 650px;
  height: 350px;
  background: radial-gradient(ellipse, rgba(233, 30, 140, 0.15) 0%, rgba(255, 183, 3, 0.05) 50%, transparent 75%);
  pointer-events: none;
  z-index: 0;
}

/* Hero Title Polish */
h1 {
  letter-spacing: -0.5px;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.8);
}

/* Primary Action Buttons (Pink Gradient + Shimmer) */
button[class*="bg-[#E91E8C]"],
a[class*="bg-[#E91E8C]"],
button[class*="bg-pink-"],
a[class*="bg-pink-"] {
  background: linear-gradient(135deg, #FF2E93 0%, #D81B60 100%) !important;
  box-shadow: 0 8px 24px rgba(233, 30, 140, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  font-weight: 700 !important;
}

button[class*="bg-[#E91E8C]"]:hover,
a[class*="bg-[#E91E8C]"]:hover,
button[class*="bg-pink-"]:hover,
a[class*="bg-pink-"]:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 12px 30px rgba(255, 90, 174, 0.7) !important;
  background: linear-gradient(135deg, #FF5AAE 0%, #E91E8C 100%) !important;
}

/* --------------------------------------------------------------------------
   3. DISH CARDS & SPECIALTY PRESENTATION
   -------------------------------------------------------------------------- */
/* Dish cards container styling */
div[class*="rounded-"][class*="border"],
article,
.card-item {
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border-radius: 18px !important;
}

/* Specialty Cards Lift & Neon Glow */
div[class*="group"][class*="cursor-pointer"],
div[class*="overflow-hidden"][class*="rounded-"] {
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(20, 20, 27, 0.65) !important;
  backdrop-filter: blur(10px) !important;
}

div[class*="group"][class*="cursor-pointer"]:hover,
div[class*="overflow-hidden"][class*="rounded-"]:hover {
  border-color: rgba(233, 30, 140, 0.45) !important;
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.8), 0 0 25px rgba(233, 30, 140, 0.25) !important;
  transform: translateY(-4px) !important;
}

/* Real Photography Image Presentation */
img[src*="hero-food-platter"],
img[src*="fish-display-counter"],
img[src*="interior-restaurant"],
img[src*="special-"] {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border-radius: 16px;
}

div:hover > img[src*="hero-food-platter"],
div:hover > img[src*="fish-display-counter"],
div:hover > img[src*="interior-restaurant"],
div:hover > img[src*="special-"] {
  transform: scale(1.04) !important;
}

/* Price Badges */
span[class*="text-[#E91E8C]"],
span[class*="text-[#FF5AAE]"] {
  font-weight: 800 !important;
  text-shadow: 0 0 10px rgba(233, 30, 140, 0.4) !important;
}

/* --------------------------------------------------------------------------
   4. MENU TABS & FILTER BUTTONS
   -------------------------------------------------------------------------- */
button[class*="rounded-full"][class*="px-"] {
  transition: all 0.25s ease !important;
  font-weight: 600 !important;
}

button[class*="rounded-full"][class*="px-"]:hover {
  border-color: var(--bb-pink-light) !important;
  color: #FFFFFF !important;
}

/* --------------------------------------------------------------------------
   5. CONTACT, MAP & FOOTER
   -------------------------------------------------------------------------- */
footer {
  border-top: 1px solid rgba(233, 30, 140, 0.2) !important;
  background: linear-gradient(180deg, #0E0E14 0%, #08080B 100%) !important;
  box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5) !important;
}

/* Subtle glow for contact highlights */
a[href^="tel:"] {
  color: var(--bb-pink-light) !important;
  font-weight: 700;
  transition: all 0.2s;
}

a[href^="tel:"]:hover {
  text-shadow: 0 0 14px rgba(255, 90, 174, 0.8);
  color: #FFFFFF !important;
}

/* Map frame polish */
iframe {
  border-radius: 16px !important;
  border: 1px solid rgba(233, 30, 140, 0.3) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6) !important;
}