/* ============================================
   LALMEK Mega Menu
   Desktop: Mega Menu | Mobile: Fullscreen Overlay
   ============================================ */

/* ── CSS Variables (defaults) ── */
:root {
  --lmm-header-bg: #FFFFFF;
  --lmm-header-height: 72px;
  --lmm-header-height-scrolled: 56px;
  --lmm-max-width: 1200px;
  --lmm-nav-color: #424242;
  --lmm-nav-hover: #0055A4;
  --lmm-nav-indicator: #0055A4;
  --lmm-mega-bg: #FFFFFF;
  --lmm-mega-heading: #0055A4;
  --lmm-mega-link: #424242;
  --lmm-mega-link-hover: #0055A4;
  --lmm-mega-border: #E0E0E0;
  --lmm-cta-bg: #FF6B00;
  --lmm-cta-color: #FFFFFF;
  --lmm-cta-radius: 4px;
  --lmm-mobile-bg: #002242;
  --lmm-mobile-color: #FFFFFF;
  --lmm-mobile-muted: rgba(255,255,255,0.4);
  --lmm-mobile-active: #FF6B00;
  --lmm-font-heading: 'Rajdhani', sans-serif;
  --lmm-font-body: 'Inter', sans-serif;
  --lmm-nav-size: 14px;
  --lmm-nav-weight: 500;
  --lmm-nav-transform: none;
  --lmm-nav-spacing: 0em;
  --lmm-mega-heading-size: 11px;
  --lmm-mega-link-size: 16px;
  --lmm-mega-max-width: 100%;
  --lmm-mobile-size: 28px;
  --lmm-mega-duration: 250ms;
  --lmm-mobile-duration: 400ms;
  --lmm-scroll-duration: 300ms;
  --lmm-cta-size: 13px;
  --lmm-cta-weight: 600;
  --lmm-cta-transform: none;
  --lmm-cta-spacing: 0em;
}

/* ── Body offset for fixed header ── */
body.lalmek-sticky {
  padding-top: var(--lmm-header-height);
}

/* Transparent: content flows behind header */
body.lalmek-sticky.lalmek-transparent {
  padding-top: 0;
}

/* ========================================================================
   HEADER
   ======================================================================== */

.lalmek-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: var(--lmm-header-bg);
  box-shadow: 0 1px 0 var(--lmm-mega-border);
  transition:
    background var(--lmm-scroll-duration) ease,
    box-shadow var(--lmm-scroll-duration) ease;
}

body:not(.lalmek-sticky) .lalmek-header {
  position: relative;
}

/* ── WordPress admin bar offset ── */
.admin-bar .lalmek-header {
  top: 32px;
}

.admin-bar.lalmek-sticky {
  padding-top: calc(var(--lmm-header-height) + 32px);
}

.admin-bar.lalmek-sticky.lalmek-transparent {
  padding-top: 0;
}

@media (max-width: 782px) {
  .admin-bar .lalmek-header {
    top: 46px;
  }

  .admin-bar.lalmek-sticky {
    padding-top: calc(var(--lmm-header-height) + 46px);
  }

  .admin-bar.lalmek-sticky.lalmek-transparent {
    padding-top: 0;
  }
}

.admin-bar .lalmek-mobile {
  top: 32px;
  height: calc(100% - 32px);
}

@media (max-width: 782px) {
  .admin-bar .lalmek-mobile {
    top: 46px;
    height: calc(100% - 46px);
  }
}

/* Transparent state (front page) */
.lalmek-header[data-transparent]:not(.is-scrolled) {
  background: transparent;
  box-shadow: none;
}

.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-nav__menu > li > a,
.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-header__cta,
.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-header__logo-text {
  color: #fff;
}

.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-burger span {
  background: #fff;
}

.lalmek-header[data-transparent]:not(.is-scrolled) .custom-logo {
  filter: brightness(0) invert(1);
}

/* Scrolled state */
.lalmek-header.is-scrolled {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* ── Header inner ── */
.lalmek-header__inner {
  max-width: var(--lmm-max-width);
  margin: 0 auto;
  padding: 0 24px;
  height: var(--lmm-header-height);
  display: flex;
  align-items: center;
  gap: 32px;
  transition: height var(--lmm-scroll-duration) ease;
}

/* Krympt header vid scroll (globalt). Body-paddingen behåller full höjd så innehållet inte hoppar. */
.lalmek-header.is-scrolled .lalmek-header__inner {
  height: var(--lmm-header-height-scrolled);
}

/* ── Logo ── */
.lalmek-header__logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  flex-shrink: 0;
}

.lalmek-header__logo .custom-logo-link {
  display: flex;
  align-items: center;
}

.lalmek-header__logo .custom-logo {
  height: calc(var(--lmm-header-height) - 32px);
  width: auto;
  transition:
    filter var(--lmm-scroll-duration) ease,
    height var(--lmm-scroll-duration) ease;
}

.lalmek-header__logo-text {
  font-family: var(--lmm-font-heading);
  font-size: 18px;
  font-weight: 700;
  color: var(--lmm-nav-hover);
  letter-spacing: 0.02em;
  transition: color var(--lmm-scroll-duration) ease;
}

/* Hide text when logo image exists */
.lalmek-header__logo .custom-logo-link + .lalmek-header__logo-text {
  display: none;
}

/* ── Logo image (from plugin settings) ── */
.lalmek-header__logo-img {
  height: calc(var(--lmm-header-height) - 32px);
  width: auto;
  display: block;
  transition:
    opacity var(--lmm-scroll-duration) ease,
    height var(--lmm-scroll-duration) ease;
}

/* Logotypen följer med när headern krymper */
.lalmek-header.is-scrolled .lalmek-header__logo-img,
.lalmek-header.is-scrolled .lalmek-header__logo .custom-logo {
  height: calc(var(--lmm-header-height-scrolled) - 24px);
}

.lalmek-header__logo-img--white {
  display: none;
}

/* Transparent state: swap to white logo */
.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-header__logo-img {
  display: none;
}

.lalmek-header[data-transparent]:not(.is-scrolled) .lalmek-header__logo-img--white {
  display: block;
}

/* When scrolled back to solid: show normal, hide white */
.lalmek-header[data-transparent].is-scrolled .lalmek-header__logo-img:not(.lalmek-header__logo-img--white) {
  display: block;
}

.lalmek-header[data-transparent].is-scrolled .lalmek-header__logo-img--white {
  display: none;
}

/* Mobile logo */
.lalmek-mobile__logo-img {
  height: 28px;
  width: auto;
  display: block;
}

/* Screen reader text utility */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* ── CTA button ── */
.lalmek-header__cta {
  display: inline-flex;
  align-items: center;
  padding: 8px 20px;
  background: var(--lmm-cta-bg);
  color: var(--lmm-cta-color);
  font-family: var(--lmm-font-body);
  font-size: var(--lmm-cta-size, 13px);
  font-weight: var(--lmm-cta-weight, 600);
  text-transform: var(--lmm-cta-transform, none);
  letter-spacing: var(--lmm-cta-spacing, 0em);
  text-decoration: none;
  border-radius: var(--lmm-cta-radius);
  transition: opacity 0.2s, background 0.2s;
  flex-shrink: 0;
  margin-left: auto;
}

.lalmek-header__cta:hover {
  opacity: 0.9;
}

/* ========================================================================
   DESKTOP NAVIGATION
   ======================================================================== */

.lalmek-nav {
  display: none;
  flex: 1;
}

.lalmek-nav__menu {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: flex-end;
}

/* Center nav variant */
.lalmek-header--nav-center .lalmek-nav__menu {
  justify-content: center;
}

.lalmek-header--nav-center .lalmek-header__cta {
  margin-left: 0;
}

/* ── Hide Astra theme dropdown arrows (plugin adds its own .lalmek-chevron) ── */
.lalmek-header .dropdown-menu-toggle,
.lalmek-header .sub-arrow,
.lalmek-header .ast-menu-toggle,
.lalmek-header .astra-menu-toggle {
  display: none !important;
}

/* Hide ALL arrows/chevrons inside mega dropdown */
.lalmek-header .sub-menu a::after,
.lalmek-header .sub-menu a::before,
.lalmek-header .sub-menu .lalmek-chevron,
.lalmek-header .sub-menu .dropdown-menu-toggle,
.lalmek-header .sub-menu .sub-arrow {
  content: none !important;
  display: none !important;
}

/* ── Prevent themes from breaking mega-dropdown positioning ── */
/* The mega .sub-menu uses position:absolute and needs the containing block
   to be .lalmek-header (position:fixed). If any intermediate ancestor gets
   position:relative from a theme, the dropdown width collapses. */
.lalmek-header__inner,
.lalmek-nav,
.lalmek-nav__menu {
  position: static !important;
}

/* ── Top-level items ── */
.lalmek-nav__menu > li:not(.dropdown) {
  position: static !important;
}

.lalmek-nav__menu > li > a {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 8px 14px;
  font-family: var(--lmm-font-body);
  font-size: var(--lmm-nav-size);
  font-weight: var(--lmm-nav-weight);
  text-transform: var(--lmm-nav-transform);
  letter-spacing: var(--lmm-nav-spacing);
  color: var(--lmm-nav-color);
  text-decoration: none;
  border-radius: 4px;
  transition: color 0.2s, background 0.2s;
  white-space: nowrap;
  position: relative;
}

/* Hover line */
.lalmek-nav__menu > li > a::before {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 14px;
  right: 14px;
  height: 2px;
  background: var(--lmm-nav-indicator);
  border-radius: 1px;
  transform: scaleX(0);
  opacity: 0;
  transition: transform 0.25s ease, opacity 0.2s ease;
}

.lalmek-nav__menu > li > a:hover::before,
.lalmek-nav__menu > li > a:focus-visible::before {
  transform: scaleX(1);
  opacity: 1;
}

/* Hide hover line on active items (they have the permanent line instead) */
.lalmek-nav__menu > li.current-menu-item > a::before,
.lalmek-nav__menu > li.current-menu-ancestor > a::before {
  display: none;
}

.lalmek-nav__menu > li > a:hover,
.lalmek-nav__menu > li > a:focus-visible,
.lalmek-nav__menu > li.current-menu-item > a,
.lalmek-nav__menu > li.current-menu-ancestor > a {
  color: var(--lmm-nav-hover);
}

/* Active indicator line */
.lalmek-nav__menu > li.current-menu-item > a::after,
.lalmek-nav__menu > li.current-menu-ancestor > a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 14px;
  right: 14px;
  height: 2px;
  background: var(--lmm-nav-indicator);
  border-radius: 1px;
}

/* Chevron */
.lalmek-chevron {
  transition: transform 0.2s;
  flex-shrink: 0;
}

.lalmek-nav__menu > li.mega-open > a .lalmek-chevron {
  transform: rotate(180deg);
}

/* ========================================================================
   MEGA DROPDOWN
   ======================================================================== */

.lalmek-nav__menu > li > .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: auto;
  background: var(--lmm-mega-bg);
  border-top: 1px solid var(--lmm-mega-border);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
  padding: 32px 0;
  list-style: none;
  margin: 0;

  /* Layout: columns */
  display: flex;
  gap: 0;

  /* Hidden state */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Animation: fade-down */
[data-mega-animation="fade-down"] .lalmek-nav__menu > li > .sub-menu {
  transform: translateY(-8px);
  transition:
    opacity var(--lmm-mega-duration) ease,
    transform var(--lmm-mega-duration) ease,
    visibility 0s var(--lmm-mega-duration);
}

/* Animation: fade */
[data-mega-animation="fade"] .lalmek-nav__menu > li > .sub-menu {
  transition:
    opacity var(--lmm-mega-duration) ease,
    visibility 0s var(--lmm-mega-duration);
}

/* Animation: none */
[data-mega-animation="none"] .lalmek-nav__menu > li > .sub-menu {
  transition: none;
}

/* Visible state */
.lalmek-nav__menu > li.mega-open > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  transition:
    opacity var(--lmm-mega-duration) ease,
    transform var(--lmm-mega-duration) ease,
    visibility 0s 0s;
}

[data-mega-animation="none"] .lalmek-nav__menu > li.mega-open > .sub-menu {
  transition: none;
}

/* ── Mega inner wrapper ── */
.lalmek-nav__menu > li > .sub-menu {
  padding-left: max(24px, calc((100% - var(--lmm-max-width)) / 2 + 24px));
  padding-right: max(24px, calc((100% - var(--lmm-max-width)) / 2 + 24px));
}

/* ── Mega columns (depth 1 items) ── */
.lalmek-nav__menu > li > .sub-menu > li {
  flex: 1;
  min-width: 0;
  padding: 0 20px;
  list-style: none;
}

.lalmek-nav__menu > li > .sub-menu > li + li {
  border-left: 1px solid var(--lmm-mega-border);
}

/* same-column: merged into previous column by JS, hide the empty shell */
.lalmek-nav__menu > li > .sub-menu > li.same-column--merged {
  display: none;
}

/* Spacing between stacked groups within one column */
.lmm-column-group + .lmm-column-group {
  margin-top: 18px;
}

/* Column heading (depth 1 link or heading span) */
.lalmek-nav__menu > li > .sub-menu > li > a,
.lalmek-nav__menu > li > .sub-menu > li > .lalmek-menu-heading,
.lmm-column-group > a,
.lmm-column-group > .lalmek-menu-heading {
  display: block;
  font-family: var(--lmm-font-heading);
  font-size: var(--lmm-mega-heading-size);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--lmm-mega-heading);
  text-decoration: none;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--lmm-mega-border);
}

.lalmek-nav__menu > li > .sub-menu > li > a:hover,
.lmm-column-group > a:hover {
  color: var(--lmm-mega-link-hover);
}

/* Non-clickable heading: no pointer, no hover change */
.lalmek-menu-heading {
  cursor: default;
}

/* Column links (depth 2) */
.lalmek-nav__menu > li > .sub-menu > li > .sub-menu,
.lmm-column-group > .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a,
.lmm-column-group > .sub-menu > li > a {
  display: block;
  font-family: var(--lmm-font-body);
  font-size: var(--lmm-mega-link-size);
  font-weight: 400;
  color: var(--lmm-mega-link);
  text-decoration: none;
  padding: 5px 0;
  transition: color 0.15s;
}

.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a:hover,
.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a:focus-visible,
.lmm-column-group > .sub-menu > li > a:hover,
.lmm-column-group > .sub-menu > li > a:focus-visible {
  color: var(--lmm-mega-link-hover);
}

/* ========================================================================
   REGULAR DROPDOWN (add CSS class "dropdown" to menu item)
   ======================================================================== */

.lalmek-nav__menu > li.dropdown {
  position: relative;
}

.lalmek-nav__menu > li.dropdown > .sub-menu {
  left: 0;
  right: auto;
  width: 220px;
  padding: 8px 0;
  flex-direction: column;
  border-radius: 0 0 6px 6px;
  padding-left: 0;
  padding-right: 0;
}

[data-mega-animation="fade-down"] .lalmek-nav__menu > li.dropdown > .sub-menu {
  transform: translateY(-8px);
}

.lalmek-nav__menu > li.dropdown.mega-open > .sub-menu {
  transform: none;
}

.lalmek-nav__menu > li.dropdown > .sub-menu > li {
  flex: none;
  min-width: 0;
  max-width: none;
  padding: 0;
  border-left: none;
}

.lalmek-nav__menu > li.dropdown > .sub-menu > li + li {
  border-left: none;
}

.lalmek-nav__menu > li.dropdown > .sub-menu > li > a,
.lalmek-nav__menu > li.dropdown > .sub-menu > li > .lalmek-menu-heading {
  font-family: var(--lmm-font-body);
  font-size: 14px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--lmm-mega-link);
  padding: 8px 20px;
  margin-bottom: 0;
  border-bottom: none;
}

.lalmek-nav__menu > li.dropdown > .sub-menu > li > a:hover {
  color: var(--lmm-mega-link-hover);
  background: var(--lmm-nav-indicator);
  background: rgba(0, 85, 164, 0.05);
}

/* ========================================================================
   MEGA MENU: ICON / BADGE / DESCRIPTION
   ======================================================================== */

.lmm-item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: rgba(0, 85, 164, 0.08);
  border-radius: 6px;
  font-size: 16px;
  line-height: 1;
  flex-shrink: 0;
}

.lmm-item-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.lmm-item-title {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lmm-item-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  padding: 2px 6px;
  background: #29A166;
  color: #fff;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  vertical-align: middle;
}

.lmm-item-desc {
  font-size: 12px;
  font-weight: 400;
  color: #888;
  line-height: 1.3;
}

/* Enrich sub-menu links that contain icon/content spans */
.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a > .lmm-item-icon:first-child {
  /* Presence of icon triggers flex layout on parent via adjacent selectors below */
}

/* When icon or content wrapper exists, make the link a flex container */
.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a:has(.lmm-item-icon),
.lalmek-nav__menu > li > .sub-menu > li > .sub-menu > li > a:has(.lmm-item-content) {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

/* Fallback for browsers without :has() — column heading links also enriched */
.lalmek-nav__menu .lmm-item-icon ~ .lmm-item-content {
  flex: 1;
}

/* ========================================================================
   MEGA MENU: SIDEBAR COLUMN (promo + quick links)
   ======================================================================== */

.lmm-sidebar-col {
  flex: 0 0 280px !important;
  max-width: 280px !important;
  min-width: 280px !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0 20px !important;
  border-left: 1px solid var(--lmm-mega-border) !important;
}

/* ── Quick links ── */
.lmm-quick-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.15s;
}

.lmm-quick-link:hover {
  background: rgba(0, 0, 0, 0.03);
}

.lmm-quick-link__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: var(--lmm-ql-color, #0055A4);
  color: #fff;
  border-radius: 8px;
  font-size: 16px;
  flex-shrink: 0;
  opacity: 0.9;
}

.lmm-quick-link__content {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.lmm-quick-link__text {
  font-family: var(--lmm-font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--lmm-mega-link);
  line-height: 1.3;
}

.lmm-quick-link__subtext {
  font-family: var(--lmm-font-body);
  font-size: 11px;
  font-weight: 400;
  color: #888;
  line-height: 1.3;
}

/* ── Promo card ── */
.lmm-promo {
  border-radius: 10px;
  overflow: hidden;
  background: linear-gradient(160deg, #002242, #003366);
  color: #fff;
  margin-top: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 18px;
  gap: 14px;
}

.lmm-promo__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lmm-promo__label {
  font-family: var(--lmm-font-heading);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6EC4CC;
  margin-bottom: 2px;
}

.lmm-promo__heading {
  display: block;
  font-family: var(--lmm-font-heading);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

.lmm-promo__desc {
  font-size: 13px;
  line-height: 1.45;
  opacity: 0.7;
  margin: 0;
}

.lmm-promo__img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
  flex-shrink: 0;
}

.lmm-promo__link {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 6px;
  font-family: var(--lmm-font-body);
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  margin-top: auto;
  transition: background 0.15s;
}

.lmm-promo__link:hover {
  background: rgba(255, 255, 255, 0.2);
}

/* ========================================================================
   MEGA MENU: FOOTER (full width)
   ======================================================================== */

.lmm-mega-footer {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px 0 !important;
  margin-top: 20px;
  border-top: 1px solid var(--lmm-mega-border);
  border-left: none !important;
}

/* Override column-heading styles that leak into the footer link */
.lalmek-nav__menu > li > .sub-menu > li.lmm-mega-footer > .lmm-mega-footer__link,
.lmm-mega-footer__link {
  font-family: var(--lmm-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--lmm-nav-hover);
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0;
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
  white-space: nowrap;
  transition: opacity 0.15s;
}

.lmm-mega-footer__link:hover {
  opacity: 0.8;
}

.lmm-mega-footer__search {
  position: relative;
  max-width: 240px;
  flex: 1;
}

.lmm-mega-footer__input {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--lmm-mega-border);
  border-radius: 6px;
  font-family: var(--lmm-font-body);
  font-size: 13px;
  color: var(--lmm-mega-link);
  background: #f8f8f8;
  outline: none;
  transition: border-color 0.15s, background 0.15s;
}

.lmm-mega-footer__input:focus {
  border-color: var(--lmm-nav-hover);
  background: #fff;
}

.lmm-mega-footer__search-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #999;
  pointer-events: none;
}

/* Sub-menu with footer needs flex-wrap */
.lmm-has-footer {
  flex-wrap: wrap;
}

/* ── Header overlay (behind mega dropdown) ──
   Absolut positionerad mot .lalmek-header och startar vid top: 100%, dvs
   precis under menyraden. Tidigare täckte den (position: fixed, top: 0)
   hela viewporten och lade sig över headerns egen bakgrund, så menyraden
   tonades ned tillsammans med sidinnehållet. Höjden 100vh täcker resten
   av skärmen och följer automatiskt headerns höjd (även krympt vid scroll). */
.lalmek-header::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 100vh;
  background: rgba(0, 0, 0, 0.25);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--lmm-mega-duration) ease;
  z-index: -1;
}

.lalmek-header.mega-active::after {
  opacity: 1;
}

/* ========================================================================
   HAMBURGER BUTTON
   ======================================================================== */

.lalmek-burger {
  position: relative;
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  margin-left: auto;
  background: none;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  box-sizing: border-box;
  min-width: 0;
  min-height: 0;
  line-height: 1;
  font-size: 0;
  overflow: visible;
}

.lalmek-burger span {
  position: absolute;
  left: 6px;
  right: 6px;
  height: 2px;
  margin: 0;
  padding: 0;
  background: var(--lmm-nav-color);
  border: none;
  border-radius: 1px;
  box-sizing: border-box;
  transition:
    transform 0.3s ease,
    opacity 0.3s ease;
  transform-origin: center;
}

/* 3 streck: centrerade vertikalt med 6px mellan center-till-center */
.lalmek-burger span:nth-child(1) { top: 11px; }
.lalmek-burger span:nth-child(2) { top: 17px; }
.lalmek-burger span:nth-child(3) { top: 23px; }

/* Hamburger → X: streck 1 och 3 flyttas till streck 2:s position och roteras */
.lalmek-burger.is-active span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.lalmek-burger.is-active span:nth-child(2) {
  opacity: 0;
}

.lalmek-burger.is-active span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

/* ========================================================================
   MOBILE FULLSCREEN OVERLAY
   ======================================================================== */

.lalmek-mobile {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1001;
  background: var(--lmm-mobile-bg);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;

  /* Hidden */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* ── Animation variants ── */
.lalmek-mobile[data-animation="fade"] {
  transition:
    opacity var(--lmm-mobile-duration) ease,
    visibility 0s var(--lmm-mobile-duration);
}

.lalmek-mobile[data-animation="slide-right"] {
  transform: translateX(100%);
  transition:
    opacity var(--lmm-mobile-duration) ease,
    transform var(--lmm-mobile-duration) cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s var(--lmm-mobile-duration);
}

.lalmek-mobile[data-animation="slide-left"] {
  transform: translateX(-100%);
  transition:
    opacity var(--lmm-mobile-duration) ease,
    transform var(--lmm-mobile-duration) cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s var(--lmm-mobile-duration);
}

.lalmek-mobile[data-animation="none"] {
  transition: none;
}

/* ── Visible ── */
.lalmek-mobile.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  transition:
    opacity var(--lmm-mobile-duration) ease,
    transform var(--lmm-mobile-duration) cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s 0s;
}

.lalmek-mobile[data-animation="none"].is-open {
  transition: none;
}

/* ── Inner layout ── */
.lalmek-mobile__inner {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 24px;
}

/* ── Mobile header ── */
.lalmek-mobile__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}

.lalmek-mobile__logo {
  font-family: var(--lmm-font-heading);
  font-size: 16px;
  font-weight: 700;
  color: var(--lmm-mobile-color);
  text-decoration: none;
  letter-spacing: 0.05em;
}

.lalmek-mobile__close {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--lmm-mobile-color);
  font-size: 28px;
  font-weight: 300;
  cursor: pointer;
  -webkit-appearance: none;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.lalmek-mobile__close:hover {
  opacity: 1;
}

/* ── Mobile nav ── */
.lalmek-mobile__nav {
  flex: 1;
  display: flex;
  align-items: center;
}

.lalmek-mobile__menu {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

/* Top-level items */
.lalmek-mobile__menu > li {
  position: relative;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.lalmek-mobile__menu > li > a {
  display: block;
  font-family: var(--lmm-font-heading);
  font-size: var(--lmm-mobile-size);
  font-weight: 300;
  color: var(--lmm-mobile-muted);
  text-decoration: none;
  padding: 12px 50px 12px 0;
  line-height: 1.3;
  transition: color 0.2s;
}

/* Items without children don't need right padding */
.lalmek-mobile__menu > li:not(.menu-item-has-children) > a {
  padding-right: 0;
}

.lalmek-mobile__menu > li > a:hover,
.lalmek-mobile__menu > li > a:focus-visible,
.lalmek-mobile__menu > li.current-menu-item > a,
.lalmek-mobile__menu > li.current-menu-ancestor > a {
  color: var(--lmm-mobile-color);
  font-weight: 700;
}

/* Active indicator dot */
.lalmek-mobile__menu > li.current-menu-item > a::before,
.lalmek-mobile__menu > li.current-menu-ancestor > a::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--lmm-mobile-active);
  border-radius: 50%;
  margin-right: 10px;
  vertical-align: middle;
}

/* ── Mobile accordion toggle ── */
.lalmek-mobile__toggle {
  position: absolute;
  right: -8px;
  top: 0;
  bottom: 0;
  width: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  color: var(--lmm-mobile-muted);
  transition: color 0.2s;
}

.lalmek-mobile__toggle svg {
  transition: transform 0.3s ease;
}

.lalmek-mobile__toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

.lalmek-mobile__toggle[aria-expanded="true"] {
  color: var(--lmm-mobile-active);
}

/* ── Mobile sub-menus (accordion) ── */
.lalmek-mobile__menu .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0 0 0 16px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), padding 0.35s ease;
}

.lalmek-mobile__menu .sub-menu.is-open {
  max-height: 2000px;
  padding-bottom: 8px;
  transition: max-height 0.5s cubic-bezier(0, 0.6, 0.4, 1), padding 0.35s ease;
}

/* Stagger sub-items */
.lalmek-mobile__menu .sub-menu > li {
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.lalmek-mobile__menu .sub-menu.is-open > li {
  opacity: 1;
  transform: none;
}

.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(1) { transition-delay: 0.05s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(2) { transition-delay: 0.08s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(3) { transition-delay: 0.11s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(4) { transition-delay: 0.14s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(5) { transition-delay: 0.17s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(6) { transition-delay: 0.20s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(7) { transition-delay: 0.23s; }
.lalmek-mobile__menu .sub-menu.is-open > li:nth-child(8) { transition-delay: 0.26s; }

.lalmek-mobile__menu .sub-menu a {
  display: block;
  font-family: var(--lmm-font-body);
  font-size: 16px;
  font-weight: 400;
  color: var(--lmm-mobile-muted);
  text-decoration: none;
  padding: 10px 0 10px 14px;
  border-left: 2px solid rgba(255, 255, 255, 0.1);
  transition: color 0.15s, border-color 0.15s;
}

.lalmek-mobile__menu .sub-menu a:hover,
.lalmek-mobile__menu .sub-menu a:focus-visible {
  color: var(--lmm-mobile-color);
  border-color: var(--lmm-mobile-active);
}

/* Nested sub-menus (depth 2) — auto-expand when parent is open */
.lalmek-mobile__menu .sub-menu.is-open .sub-menu {
  max-height: 2000px;
  overflow: visible;
  padding-left: 0;
  padding-bottom: 0;
}

/* Show nested items immediately */
.lalmek-mobile__menu .sub-menu.is-open .sub-menu > li {
  opacity: 1;
  transform: none;
}

/* Hide accordion toggles on nested (depth 1) items */
.lalmek-mobile__menu .sub-menu .lalmek-mobile__toggle {
  display: none;
}

/* Style depth-1 items as section headings in mobile */
.lalmek-mobile__menu > li > .sub-menu > li > a,
.lalmek-mobile__menu > li > .sub-menu > li > .lalmek-menu-heading {
  font-family: var(--lmm-font-heading);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--lmm-mobile-active);
  padding: 16px 0 6px 0;
  border-left: none;
}

/* First section heading needs no top padding */
.lalmek-mobile__menu > li > .sub-menu > li:first-child > a,
.lalmek-mobile__menu > li > .sub-menu > li:first-child > .lalmek-menu-heading {
  padding-top: 4px;
}

/* Depth-2 links: normal style */
.lalmek-mobile__menu > li > .sub-menu > li > .sub-menu > li > a {
  font-family: var(--lmm-font-body);
  font-size: 15px;
  font-weight: 400;
  color: var(--lmm-mobile-muted);
  text-transform: none;
  letter-spacing: 0;
  padding: 8px 0 8px 14px;
  border-left: 2px solid rgba(255, 255, 255, 0.1);
}

.lalmek-mobile__menu > li > .sub-menu > li > .sub-menu > li > a:hover,
.lalmek-mobile__menu > li > .sub-menu > li > .sub-menu > li > a:focus-visible {
  color: var(--lmm-mobile-color);
  border-color: var(--lmm-mobile-active);
}

.lalmek-mobile__menu .sub-menu .sub-menu a {
  font-size: 14px;
}

/* ── Mobile footer ── */
.lalmek-mobile__footer {
  padding-top: 32px;
  margin-top: auto;
}

.lalmek-mobile__contact {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 16px;
  font-family: var(--lmm-font-body);
  font-size: 14px;
  line-height: 1.6;
  color: var(--lmm-mobile-muted);
}

.lalmek-mobile__contact a {
  color: var(--lmm-mobile-color);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  transition: border-color 0.15s;
}

.lalmek-mobile__contact a:hover {
  border-color: var(--lmm-mobile-active);
}

.lalmek-mobile__cta {
  display: block;
  text-align: center;
  padding: 14px 24px;
  background: var(--lmm-cta-bg);
  color: var(--lmm-cta-color);
  font-family: var(--lmm-font-body);
  font-size: var(--lmm-cta-size, 15px);
  font-weight: var(--lmm-cta-weight, 600);
  text-transform: var(--lmm-cta-transform, none);
  letter-spacing: var(--lmm-cta-spacing, 0em);
  text-decoration: none;
  border-radius: var(--lmm-cta-radius);
  transition: opacity 0.2s;
}

.lalmek-mobile__cta:hover {
  opacity: 0.9;
}

/* ── Mobile stagger animation ── */
.lalmek-mobile__menu > li {
  opacity: 0;
  transform: translateY(16px);
}

.lalmek-mobile.is-open .lalmek-mobile__menu > li {
  opacity: 1;
  transform: none;
  transition: opacity 0.35s ease, transform 0.35s ease;
}

.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(1) { transition-delay: 0.06s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(2) { transition-delay: 0.12s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(3) { transition-delay: 0.18s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(4) { transition-delay: 0.24s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(5) { transition-delay: 0.30s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(6) { transition-delay: 0.36s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(7) { transition-delay: 0.42s; }
.lalmek-mobile.is-open .lalmek-mobile__menu > li:nth-child(8) { transition-delay: 0.48s; }

.lalmek-mobile__footer {
  opacity: 0;
  transform: translateY(16px);
}

.lalmek-mobile.is-open .lalmek-mobile__footer {
  opacity: 1;
  transform: none;
  transition: opacity 0.35s ease, transform 0.35s ease;
  transition-delay: 0.45s;
}

/* Body scroll lock */
body.lalmek-menu-open {
  overflow: hidden;
}

/* ========================================================================
   RESPONSIVE
   ======================================================================== */

/* Desktop: show nav, hide burger */
@media (min-width: 1024px) {
  .lalmek-nav {
    display: block;
  }

  .lalmek-burger {
    display: none;
  }
}

/* Mobile: hide desktop CTA, sidebar, promo, footer, icons */
@media (max-width: 1023px) {
  .lalmek-header__cta {
    display: none;
  }

  .lalmek-header__inner {
    padding: 0 16px;
  }

  .lmm-sidebar-col,
  .lmm-promo,
  .lmm-mega-footer,
  .lmm-item-icon,
  .lmm-item-desc,
  .lmm-item-badge {
    display: none;
  }

  .lmm-item-content {
    display: inline;
  }

  .lmm-item-title {
    display: inline;
  }
}

/* ========================================================================
   ACCESSIBILITY
   ======================================================================== */

/* Focus visible outlines */
.lalmek-nav__menu > li > a:focus-visible,
.lalmek-header__cta:focus-visible,
.lalmek-burger:focus-visible,
.lalmek-mobile__close:focus-visible,
.lalmek-mobile__menu a:focus-visible,
.lalmek-mobile__cta:focus-visible,
.lalmek-mobile__toggle:focus-visible {
  outline: 2px solid var(--lmm-nav-indicator);
  outline-offset: 2px;
}

/* ========================================================================
   REDUCED MOTION
   ======================================================================== */

@media (prefers-reduced-motion: reduce) {
  .lalmek-header,
  .lalmek-header__inner,
  .lalmek-header__logo-img,
  .lalmek-header__logo .custom-logo,
  .lalmek-header::after,
  .lalmek-mobile,
  .lalmek-nav__menu > li > .sub-menu,
  .lalmek-mobile__menu .sub-menu,
  .lalmek-mobile__menu > li,
  .lalmek-mobile__footer,
  .lalmek-burger span,
  .lalmek-chevron {
    transition: none !important;
  }

  .lalmek-mobile__menu > li,
  .lalmek-mobile__footer {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ========================================================================
   BEAVER BUILDER EDIT MODE
   ======================================================================== */

.fl-builder-edit .lalmek-header,
.fl-builder-edit .lalmek-mobile {
  display: none !important;
}

body.fl-builder-edit.lalmek-sticky {
  padding-top: 0 !important;
}