/* The Shala additions on top of the original Elementor styles. */

/* Smooth scrolling (Lenis) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-stopped { overflow: clip; }
[data-lenis-prevent] { overscroll-behavior: contain; }

/* Buttons: a gentle lift on hover */
.elementor-button, .book-now-btn, .elementor-nav-menu .nav-btn > a {
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s cubic-bezier(.2,.7,.2,1), background-color .3s, color .3s;
}
@media (hover: hover) {
  .elementor-button:hover, .book-now-btn:hover, .elementor-nav-menu .nav-btn > a:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px -10px rgba(34, 31, 31, .45);
  }
}

/* Buttons: roomier padding on phones (overrides the per-button Elementor padding) */
@media (max-width: 767px) {
  .elementor-widget-button .elementor-button { padding: 12px 22px !important; }
}

/* Header (and its drop-down menus) always sits above the page and footer,
   which share the same z-index as the header in the Elementor styles */
.elementor-location-header { position: relative; z-index: 9990; }

/* Header: soft shadow once the page has scrolled */
.elementor-location-header .elementor-sticky--active { transition: box-shadow .4s ease; }
body.shala-scrolled .elementor-location-header .elementor-sticky--active:not(.elementor-sticky__spacer) {
  box-shadow: 0 6px 24px -18px rgba(34, 31, 31, .5);
}

/* Accordion icon turns smoothly */
.e-n-accordion-item-title-icon { transition: transform .4s cubic-bezier(.2,.7,.2,1); }

@media (prefers-reduced-motion: reduce) {
  .elementor-button, .book-now-btn { transition: none; }
}

/* Mobile/tablet menu: a rounded pop-up card under the header.
   Each item is its own block; sub-pages get a small orange dot. */
@keyframes shalaMenuIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes shalaSubIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (max-width: 1024px) {
  .elementor-location-header nav.elementor-nav-menu--dropdown[aria-hidden="false"] {
    position: fixed !important; left: 12px !important; right: 12px !important; top: 97px !important;
    width: auto !important; height: auto !important; max-height: calc(100dvh - 113px) !important;
    overflow-y: auto !important; overscroll-behavior: contain;
    background: #F8F0F0 !important; border-radius: 24px !important; padding: 12px 12px 4px !important; box-sizing: border-box;
    box-shadow: 0 18px 40px -12px rgba(34, 31, 31, .35), 0 2px 8px rgba(34, 31, 31, .08) !important;
    margin: 0 !important; transition: none !important;
    animation: shalaMenuIn .35s cubic-bezier(.2, .7, .2, 1) both !important;
  }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul { display: flex !important; flex-direction: column; gap: 8px; margin: 0 !important; padding: 0 !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown a { background: none !important; color: #221F1F !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul > li:not(.nav-btn) { background: #EDD9D9; border-radius: 16px; border: 0 !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul > li > a {
    font-family: "Plus Jakarta Sans", sans-serif !important; font-size: 20px !important; font-weight: 600 !important; line-height: 1.25 !important;
    letter-spacing: -.01em !important; padding: 15px 18px !important; width: 100%; box-sizing: border-box;
    justify-content: space-between !important; border: 0 !important;
  }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-arrow { font-size: 15px !important; opacity: .6; transition: transform .3s; }
  .elementor-location-header nav.elementor-nav-menu--dropdown a[aria-expanded="true"] .sub-arrow { transform: rotate(180deg); }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu { position: static !important; background: none !important; border: 0 !important; padding: 0 18px 14px !important; margin: 0 !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu li { margin: 0 0 4px !important; border: 0 !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu[aria-hidden="false"] li { animation: shalaSubIn .3s ease-out both; }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu[aria-hidden="false"] li:nth-child(2) { animation-delay: .05s; }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu[aria-hidden="false"] li:nth-child(3) { animation-delay: .1s; }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu a {
    font-family: "Plus Jakarta Sans", sans-serif !important; font-size: 16px !important; font-weight: 500 !important;
    padding: 8px 0 8px 16px !important; border: 0 !important; position: relative;
  }
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu a::before {
    content: ""; position: absolute; left: 2px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: #EB7745;
  }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul > li.nav-btn { border: 0; width: 100% !important; margin: 0 !important; padding: 6px 0 0 !important; }
  .elementor-location-header nav.elementor-nav-menu--dropdown > ul > li.nav-btn > a {
    display: flex !important; width: 100% !important; margin: 0 !important; box-sizing: border-box; justify-content: center !important;
    font-family: "Plus Jakarta Sans", sans-serif !important; font-size: 17px !important; font-weight: 600 !important;
    background: #EB7745 !important; color: #221F1F !important; border-radius: 999px; padding: 15px !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-location-header nav.elementor-nav-menu--dropdown[aria-hidden="false"] { left: auto !important; width: 420px !important; }
}
@media (max-width: 767px) {
  .elementor-location-header nav.elementor-nav-menu--dropdown[aria-hidden="false"] { top: 72px !important; max-height: calc(100dvh - 88px) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .elementor-location-header nav.elementor-nav-menu--dropdown[aria-hidden="false"],
  .elementor-location-header nav.elementor-nav-menu--dropdown .sub-menu li { animation: none !important; }
}
