:root,
[data-bs-theme="light"] {
  /* Menu */
  --#{$prefix}menu-bg: #{$menu-bg};
  --#{$prefix}menu-bg-rgb: #{$menu-bg-rgb};
  --#{$prefix}menu-color: #{$menu-color};
  --#{$prefix}menu-color-rgb: #{$menu-color-rgb};
  --#{$prefix}menu-hover-bg: #{$menu-hover-bg};
  --#{$prefix}menu-hover-color: #{$menu-hover-color};
  --#{$prefix}menu-sub-active-bg: var(--#{$prefix}primary-bg-subtle);
  --#{$prefix}menu-sub-active-color: var(--#{$prefix}primary);
  --#{$prefix}menu-active-color: #{$menu-active-color};
  --#{$prefix}menu-active-bg: #{$menu-active-bg};
  --#{$prefix}menu-active-toggle-bg: #{$menu-active-toggle-bg};
  --#{$prefix}menu-horizontal-active-bg: var(--#{$prefix}menu-bg);
  --#{$prefix}menu-box-shadow: #{$menu-box-shadow};
  --#{$prefix}menu-divider-color: #{var(--#{$prefix}white)};
  --#{$prefix}menu-width: #{$menu-width};
  --#{$prefix}menu-collapsed-width: #{$menu-collapsed-width};
  --#{$prefix}menu-item-spacer: #{$menu-item-spacer};
  --#{$prefix}menu-vertical-link-padding-y: #{$menu-vertical-link-padding-y};
  --#{$prefix}menu-vertical-link-padding-x: #{$menu-vertical-link-padding-x};
  --#{$prefix}menu-vertical-menu-link-padding-y: #{$menu-vertical-menu-link-padding-y};
  --#{$prefix}menu-vertical-menu-level-spacer: #{$menu-vertical-menu-level-spacer};
  --#{$prefix}menu-horizontal-menu-box-shadow: #{$menu-horizontal-menu-box-shadow};
}
//! FIX: Added data-semidark-menu attribute to avoid semi dark menu flicker effect on page load
[data-semidark-menu="true"],
[data-bs-theme="dark"]{
  --#{$prefix}menu-bg: #{$menu-bg-dark};
  --#{$prefix}menu-bg-rgb: #{$menu-bg-rgb};
  --#{$prefix}menu-active-bg: #{$menu-active-bg};
  --#{$prefix}menu-horizontal-active-bg: #{var(--#{$prefix}primary-bg-subtle)};
  --#{$prefix}menu-color: #{$menu-color-dark};
  --#{$prefix}menu-color-rgb: #{$menu-color-rgb-dark};
  --#{$prefix}menu-hover-bg: #{rgba($base-dark, .06)};
  --#{$prefix}menu-hover-color: #{$menu-color-dark};
  --#{$prefix}menu-active-bg: #{$menu-active-bg-dark};
  --#{$prefix}menu-active-color: #{$menu-active-color-dark};
  --#{$prefix}menu-active-toggle-bg: #{$menu-active-toggle-bg-dark};
  --#{$prefix}menu-sub-active-bg: var(--#{$prefix}primary);
  --#{$prefix}menu-sub-active-color: #{$menu-active-color-dark};
  --#{$prefix}menu-box-shadow: #{$menu-box-shadow-dark};
  --#{$prefix}menu-divider-color: #{$menu-divider-color};
  --#{$prefix}menu-horizontal-active-bg: var(--#{$prefix}menu-bg);
}