/* EMII Component CSS — Mobile Glass Menu */
.emii-mobile-menu {
  position: fixed;
  right: 50%;
  bottom: max(10px, var(--emii-safe-bottom));
  transform: translateX(50%);
  width: min(392px, calc(100% - 22px));
  min-height: 62px;
  padding: 5px;
  border-radius: 23px;
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 3px;
  overflow: hidden;
  z-index: 180;
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.64));
  color: var(--emii-text);
  border: 0;
  box-shadow: 0 18px 42px rgba(15,23,42,.16),
    0 4px 12px rgba(15,23,42,.08),
    inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter: blur(24px) saturate(1.4);
  -webkit-backdrop-filter: blur(24px) saturate(1.4);
}

.emii-app[data-theme="dark"] .emii-mobile-menu {
  background: linear-gradient(180deg, rgba(44,44,46,.82), rgba(28,28,30,.70));
  border-color: rgba(255,255,255,.07);
  box-shadow: 0 18px 42px rgba(0,0,0,.48),
    0 4px 12px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.emii-mobile-tab {
  min-width: 0;
  height: 52px;
  border: 0;
  background: transparent;
  color: color-mix(in srgb, var(--emii-text) 46%, var(--emii-muted));
  border-radius: 19px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: 10px;
  font-weight: 900;
  position: relative;
  transition: transform .16s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.emii-mobile-tab b {
  width: 26px;
  height: 24px;
  display: grid;
  place-items: center;
  font-size: 16px;
  line-height: 1;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
  transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.emii-mobile-tab span {
  max-width: 100%;
  font-size: 9px;
  line-height: 1;
  font-weight: 950;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.emii-mobile-tab.is-active {
  color: var(--emii-blue);
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.45));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62), 0 8px 18px rgba(0,122,255,.10);
}

.emii-app[data-theme="dark"] .emii-mobile-tab.is-active {
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 18px rgba(0,0,0,.22);
}

.emii-mobile-tab.is-active b {
  color: #fff;
  background: linear-gradient(135deg, var(--emii-blue), #5856d6);
  box-shadow: 0 8px 18px rgba(0,122,255,.22), inset 0 1px 0 rgba(255,255,255,.28);
  transform: translateY(-1px);
}

.emii-mobile-tab:not(.is-active):hover {
  color: var(--emii-blue);
  background: rgba(0,122,255,.06);
}

.emii-mobile-tab:active {
  transform: scale(.965);
}

@media (max-width: 920px) {
  .emii-mobile-menu {
    display: grid;
  }

  .emii-app {
    --emii-mobile-menu-space: calc(86px + var(--emii-safe-bottom));
    padding-bottom: calc(92px + var(--emii-safe-bottom));
  }
}

@media (max-width: 380px) {
  .emii-mobile-menu {
    width: calc(100% - 16px);
    min-height: 60px;
    border-radius: 21px;
  }

  .emii-mobile-tab {
    height: 50px;
  }

  .emii-mobile-tab span {
    font-size: 8.5px;
  }
}
