/* Lucide SVGs — core: add_lucide_assets() (admin, theme, external forms) */

svg.lucide {
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: -0.125em;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  shape-rendering: geometricPrecision;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Exclude .menu-icon — sidebar icons use explicit rules (match core i.menu-icon) */
i[data-lucide]:not(.menu-icon) {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
}

/*
 * Size utilities — add classes on <i data-lucide="..."> (Lucide copies them onto the <svg>).
 */
i[data-lucide].ui-lucide-xs,
svg.lucide.ui-lucide-xs {
  width: 0.875rem !important;
  height: 0.875rem !important;
}

i[data-lucide].ui-lucide-sm,
svg.lucide.ui-lucide-sm {
  width: 1rem !important;
  height: 1rem !important;
}

i[data-lucide].ui-lucide-md,
svg.lucide.ui-lucide-md {
  width: 1.25rem !important;
  height: 1.25rem !important;
}

i[data-lucide].ui-lucide-lg,
svg.lucide.ui-lucide-lg {
  width: 1.5rem !important;
  height: 1.5rem !important;
}

i[data-lucide].ui-lucide-xl,
svg.lucide.ui-lucide-xl {
  width: 1.75rem !important;
  height: 1.75rem !important;
}

i[data-lucide].ui-lucide-2xl,
svg.lucide.ui-lucide-2xl {
  width: 2.25rem !important;
  height: 2.25rem !important;
}

/* Align icon with text in buttons / nav links */
.ui-lucide-leading {
  margin-inline-end: 0.375rem;
}

.ui-lucide-trailing {
  margin-inline-start: 0.375rem;
}

/*
 * Admin sidebar — match Perfex core .sidebar ul.nav li a i.menu-icon (style.css):
 *   width 18px, font-size 18px, margin-right 14px, float left, block.
 * si_custom_theme / global menu icon sliders target the same i.menu-icon selectors
 * (font-size 10–24px); we use font-size: 18px as default + width/height: 1em so the
 * box scales with the themed font-size like Font Awesome.
 * Do NOT rely on 1em width before font-size is set — generic i[data-lucide] is :not(.menu-icon).
 */
body.admin .sidebar ul.nav li a > i[data-lucide].menu-icon,
body.admin #side-menu.nav li a > i[data-lucide].menu-icon,
body.admin #setup-menu li a > i[data-lucide].menu-icon {
  display: block;
  float: left;
  font-size: 18px;
  line-height: 1;
  width: 1em;
  height: 1em;
  min-width: 1em;
  min-height: 1em;
  margin-right: 14px;
  margin-inline-end: 14px;
  margin-inline-start: 0;
  padding: 0;
  text-align: center;
  vertical-align: middle;
  box-sizing: content-box;
}

body.admin .sidebar ul.nav > li .nav-second-level li a > i[data-lucide].menu-icon,
body.admin #side-menu .nav-second-level li a > i[data-lucide].menu-icon,
body.admin #setup-menu li .nav-second-level li a > i[data-lucide].menu-icon {
  margin-right: 5px;
  margin-inline-end: 5px;
  font-size: 18px;
  width: 1em;
  height: 1em;
  min-width: 1em;
  min-height: 1em;
}

body.admin .sidebar ul.nav li a > i[data-lucide].menu-icon svg.lucide,
body.admin #side-menu.nav li a > i[data-lucide].menu-icon svg.lucide,
body.admin #setup-menu li a > i[data-lucide].menu-icon svg.lucide,
body.admin .sidebar ul.nav > li .nav-second-level li a > i[data-lucide].menu-icon svg.lucide,
body.admin #side-menu .nav-second-level li a > i[data-lucide].menu-icon svg.lucide {
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  max-height: none;
  display: block;
  stroke: currentColor;
}

[dir="rtl"] body.admin .sidebar ul.nav li a > i[data-lucide].menu-icon,
[dir="rtl"] body.admin #side-menu.nav li a > i[data-lucide].menu-icon,
[dir="rtl"] body.admin #setup-menu li a > i[data-lucide].menu-icon {
  float: right;
}

[dir="rtl"] body.admin .sidebar ul.nav > li .nav-second-level li a > i[data-lucide].menu-icon,
[dir="rtl"] body.admin #side-menu .nav-second-level li a > i[data-lucide].menu-icon {
  float: right;
}