/* Lumina generated design extensions. Core Lumina layout still lives in app.css. */

.synergy-bottom-nav--lumina {
  --synergy-bottom-design-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(248, 250, 252, 0.96));
  --synergy-bottom-design-fg: #475569;
  --synergy-bottom-design-border: 1px solid rgba(148, 163, 184, 0.24);
  --synergy-bottom-design-shadow: 0 -18px 42px rgba(15, 23, 42, 0.12), inset 0 1px rgba(255, 255, 255, 0.82);
  --synergy-bottom-design-height: 66px;
  --synergy-bottom-design-pad-x: 10px;
  --synergy-bottom-design-icon-radius: 14px;
}

.synergy-bottom-nav--lumina .synergy-bottom-nav-item:hover,
.synergy-bottom-nav--lumina .synergy-bottom-nav-item.is-active,
.synergy-bottom-nav--lumina .synergy-bottom-nav-item[aria-current="page"],
.synergy-bottom-nav--lumina .synergy-bottom-nav-item[aria-current="true"] {
  color: var(--synergy-bottom-design-fg, #475569);
  background: transparent;
}

.synergy-bottom-nav--lumina .synergy-bottom-nav-item:hover .synergy-bottom-nav-icon,
.synergy-bottom-nav--lumina .synergy-bottom-nav-item.is-active .synergy-bottom-nav-icon,
.synergy-bottom-nav--lumina .synergy-bottom-nav-item[aria-current="page"] .synergy-bottom-nav-icon,
.synergy-bottom-nav--lumina .synergy-bottom-nav-item[aria-current="true"] .synergy-bottom-nav-icon {
  background: rgba(255, 255, 255, 0.78);
  color: inherit;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.synergy-bottom-nav--lumina .synergy-bottom-nav-item:active {
  color: #0f766e;
  background: rgba(15, 118, 110, 0.08);
}

.synergy-bottom-nav--lumina .synergy-bottom-nav-item:active .synergy-bottom-nav-icon {
  background: linear-gradient(135deg, #0f766e, #14b8a6);
  color: #fff;
  box-shadow: 0 12px 24px rgba(15, 118, 110, 0.28);
  transform: translateY(-1px) scale(1.04);
}