/* Premium mobile website bottom navigation — MediNova v90
   Scope: only mobile responsive website view, not a native app UI. */
@media (max-width: 767px) {
  .nova-wrap {
    padding-bottom: calc(92px + env(safe-area-inset-bottom)) !important;
  }

  .nova-bottom-premium {
    position: fixed !important;
    left: max(10px, env(safe-area-inset-left)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    height: 72px !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: end !important;
    padding: 7px 8px 8px !important;
    border: 1px solid rgba(15, 118, 110, .14) !important;
    border-radius: 26px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,253,251,.92)) !important;
    box-shadow: 0 -8px 30px rgba(15, 23, 42, .10), 0 18px 48px rgba(15, 118, 110, .16) !important;
    -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
    backdrop-filter: blur(18px) saturate(150%) !important;
    overflow: visible !important;
  }

  .nova-bottom-premium::before {
    content: "";
    position: absolute;
    inset: 6px 10px auto;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(15, 118, 110, .28), transparent);
    pointer-events: none;
  }

  .nova-bottom-premium a {
    position: relative !important;
    height: 57px !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    border-radius: 18px !important;
    color: #64748b !important;
    font-size: 10.5px !important;
    font-weight: 950 !important;
    letter-spacing: -.01em !important;
    line-height: 1 !important;
    transition: transform .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .nova-bottom-premium a:active {
    transform: translateY(1px) scale(.98) !important;
  }

  .nova-bottom-premium a.active:not(.rx-link) {
    color: #0f766e !important;
    background: linear-gradient(180deg, rgba(236, 253, 245, .96), rgba(209, 250, 229, .64)) !important;
    box-shadow: inset 0 0 0 1px rgba(20, 184, 166, .13) !important;
  }

  .nova-bottom-premium .bottom-ico {
    position: relative !important;
    width: 30px !important;
    height: 28px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 20px !important;
    line-height: 1 !important;
    filter: drop-shadow(0 5px 8px rgba(15, 23, 42, .08)) !important;
  }

  .nova-bottom-premium strong {
    display: block !important;
    font-size: 10.5px !important;
    font-weight: 950 !important;
    color: inherit !important;
  }

  .nova-bottom-premium .rx-link {
    justify-content: flex-end !important;
    padding-bottom: 1px !important;
    color: #0f766e !important;
    background: transparent !important;
  }

  .nova-bottom-premium .rx {
    width: 62px !important;
    height: 62px !important;
    margin: -34px 0 2px !important;
    border-radius: 24px !important;
    display: grid !important;
    place-items: center !important;
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 1000 !important;
    background: radial-gradient(circle at 32% 22%, #35e1c8 0, #13a99a 34%, #0f766e 72%, #075e57 100%) !important;
    border: 4px solid rgba(255,255,255,.98) !important;
    box-shadow: 0 16px 34px rgba(15, 118, 110, .38), 0 0 0 7px rgba(20, 184, 166, .10) !important;
  }

  .nova-bottom-premium .rx-link.active .rx {
    box-shadow: 0 18px 40px rgba(15, 118, 110, .44), 0 0 0 8px rgba(20, 184, 166, .16) !important;
    transform: translateY(-1px) !important;
  }

  .nova-bottom-premium .bottom-cart em {
    position: absolute;
    top: -7px;
    right: -8px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #fb7185, #ef4444);
    color: #ffffff;
    border: 2px solid #ffffff;
    font-size: 9px;
    font-style: normal;
    font-weight: 1000;
    box-shadow: 0 8px 14px rgba(239, 68, 68, .28);
  }

  .mn-whatsapp-float {
    bottom: calc(94px + env(safe-area-inset-bottom)) !important;
  }

  .floating-cart {
    bottom: calc(108px + env(safe-area-inset-bottom)) !important;
  }

  .nova-copy {
    padding-bottom: 104px !important;
  }
}

@media (max-width: 380px) {
  .nova-bottom-premium {
    left: 6px !important;
    right: 6px !important;
    height: 68px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    border-radius: 22px !important;
  }
  .nova-bottom-premium a {
    font-size: 9.5px !important;
  }
  .nova-bottom-premium strong {
    font-size: 9.5px !important;
  }
  .nova-bottom-premium .rx {
    width: 56px !important;
    height: 56px !important;
    border-radius: 21px !important;
  }
}


/* Premium account icon fix — removes weak emoji/chess glyph and uses a clean SVG user icon. */
.nova-account-action .mn-account-icon {
  width: 26px !important;
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  color: #0f766e !important;
}

.nova-account-action .mn-user-svg,
.nova-bottom-premium .mn-bottom-account .mn-user-svg,
.nova-mobile-icons .nova-mobile-account .mn-user-svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
}

@media (max-width: 767px) {
  .nova-mobile-icons .nova-mobile-account {
    min-width: 40px !important;
    width: 40px !important;
    height: 40px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 16px !important;
    color: #0f766e !important;
    border: 1px solid rgba(20, 184, 166, .22) !important;
    background: linear-gradient(180deg, #ffffff 0%, #ecfdf5 100%) !important;
    box-shadow: 0 10px 24px rgba(15, 118, 110, .10) !important;
  }

  .nova-mobile-icons .nova-mobile-account:active {
    transform: translateY(1px) scale(.98) !important;
  }

  .nova-bottom-premium .mn-bottom-account {
    color: currentColor !important;
    font-size: 0 !important;
  }

  .nova-bottom-premium .mn-bottom-account .mn-user-svg {
    width: 23px !important;
    height: 23px !important;
    stroke-width: 2.35 !important;
    filter: drop-shadow(0 6px 9px rgba(15, 23, 42, .08)) !important;
  }

  .nova-bottom-premium a.active .mn-bottom-account .mn-user-svg,
  .nova-bottom-premium a:hover .mn-bottom-account .mn-user-svg {
    color: #0f766e !important;
  }
}