/* MOBILE/TABLET: language switcher under hamburger + aligned + reliable flag/text alignment */
@media (max-width: 1024px){

  :root{
    --cosmy-lang-right-nudge: -3px; /* 0px..-6px if needed */
    --cosmy-text-shift: 0px;        /* DOWN: positive. UP: negative */
    --cosmy-flag-shift: 0px;        /* use if needed */
  }

  body .cosmy-lang-switcher{
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 78px) !important;

    right: calc(env(safe-area-inset-right, 0px) + var(--cosmy-lang-right-nudge)) !important;
    left: auto !important;

    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    translate: none !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 6px !important;

    z-index: 99999 !important;
  }

  /* Button: center everything consistently */
  body .cosmy-lang-btn{
    padding: 5px 8px !important;
    font-size: 12px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    height: 34px !important;
    line-height: 1 !important;
  }

  /* Flag */
  body .cosmy-flag{
    font-size: 16px !important;
    line-height: 1 !important;
    display: inline-block !important;

    position: relative !important;
    top: var(--cosmy-flag-shift) !important;
  }

  /* Text: apply to ANY non-flag child (works even if it's not a span) */
  body .cosmy-lang-btn > *:not(.cosmy-flag){
    position: relative !important;
    top: var(--cosmy-text-shift) !important; /* move text DOWN with +px */
    line-height: 1 !important;
  }

  /* If the text is not wrapped (rare), this still helps baseline issues */
  body .cosmy-lang-btn{
    vertical-align: middle !important;
  }
}

/* Small phones */
@media (max-width: 480px){
  body .cosmy-lang-switcher{
    top: calc(env(safe-area-inset-top, 0px) + 84px) !important;
  }

  body .cosmy-lang-btn{
    padding: 4px 7px !important;
    font-size: 11px !important;
    height: 32px !important;
  }

  body .cosmy-flag{
    font-size: 15px !important;
  }
}