/* Lunix Backstage — navegação inferior e notificações, 2026-10-14
 * Compartilhado pelos portais TikTok/BIGO e perfis admin/agenciados.
 * O overlay de notificações é movido para document.body no JavaScript para
 * escapar dos contextos de empilhamento/transforms do header e do shell.
 */

body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  background:#111114!important;
  border:1px solid rgba(var(--lunix-portal-accent-rgb,230,0,115),.28)!important;
  box-shadow:0 26px 76px rgba(0,0,0,.66)!important;
  isolation:isolate!important;
  overflow:hidden!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__head{
  flex:0 0 auto!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__close{
  display:grid!important;
  place-items:center!important;
  width:36px!important;height:36px!important;min-width:36px!important;
  padding:0!important;margin:0!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:10px!important;
  background:#222226!important;color:#eeeef2!important;
  cursor:pointer!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__close svg{
  display:block;width:19px!important;height:19px!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-backstage-notifications__close{
  background:#f4f4f6!important;border-color:rgba(20,20,25,.12)!important;color:#222!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__list{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-width:thin;
}
body.lunix-backstage-page .lunix-backstage-notifications__empty{
  flex:1 1 auto!important;
  min-height:190px!important;
  align-content:center!important;
  background:transparent!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal] .lunix-backstage-notifications__empty strong{
  color:#f5f5f7!important;
}
body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal] .lunix-backstage-notifications__empty p{
  color:#a5a5af!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal] .lunix-backstage-notifications__empty strong{
  color:#17171b!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal] .lunix-backstage-notifications__empty p{
  color:#74747c!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
  background:#fff!important;
  box-shadow:0 26px 76px rgba(30,25,35,.24)!important;
}

@media (min-width:1024px){
  body.lunix-backstage-page .lunix-backstage-notifications__backdrop[data-lunix-notifications-portal]{display:none!important;}
  body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
    position:fixed!important;
    inset:auto!important;
    top:var(--lunix-notification-top,76px)!important;
    left:var(--lunix-notification-left,auto)!important;
    right:auto!important;
    bottom:auto!important;
    z-index:100300!important;
    width:min(380px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - var(--lunix-notification-top,76px) - 16px)!important;
    padding:15px!important;
    border-radius:17px!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(9px)!important;
    transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
  }
  body.lunix-backstage-page.lunix-notifications-open .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;
    transform:translateY(0)!important;
  }
  body.lunix-backstage-page .lunix-backstage-notifications__mobile-handle{display:none!important;}
}

/* O espaço livre é um elemento em fluxo normal depois do conteúdo,
 * e não apenas um padding sujeito às regras específicas de cada módulo. */
body.lunix-backstage-page .lunix-backstage-bottom-reserve{display:none!important;}

@media (max-width:1023px){
  /* Bottom bar fixa: a região rolável reserva seu próprio espaço, inclusive
     nos módulos com formulários, chat e conteúdo de altura variável. */
  body.lunix-backstage-page{
    /* JS mede a barra de verdade, inclusive safe-area e mudanças de viewport. */
    --lunix-bottom-nav-real-height:calc(var(--lunix-mobile-bottom-h,82px) + env(safe-area-inset-bottom,0px));
    --lunix-backstage-bottom-clearance:calc(var(--lunix-bottom-nav-real-height) + 28px);
    scroll-padding-bottom:var(--lunix-backstage-bottom-clearance);
  }
  body.lunix-backstage-page .lunix-backstage-bottom-reserve{
    display:block!important;
    position:relative!important;
    visibility:hidden!important;
    pointer-events:none!important;
    width:100%!important;
    height:var(--lunix-backstage-bottom-clearance)!important;
    min-height:var(--lunix-backstage-bottom-clearance)!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    flex:none!important;
    clear:both!important;
    box-sizing:border-box!important;
  }
  /* Em páginas que não usam o shell esperado, o body ainda possui a
     distância necessária para não deixar o último controle atrás da barra. */
  body.lunix-backstage-page:has([data-lunix-mobile-bottom-nav]):not(:has([data-lunix-bottom-reserve])){
    padding-bottom:var(--lunix-backstage-bottom-clearance)!important;
  }
  body.lunix-backstage-page :is(.lunix-backstage-main,.lunix-backstage-shell){
    scroll-padding-bottom:var(--lunix-backstage-bottom-clearance);
  }
  body.lunix-backstage-page .lunix-backstage-content,
  body.lunix-backstage-page [data-lunix-shell-part="content"]{
    padding-bottom:var(--lunix-backstage-bottom-clearance)!important;
    scroll-padding-bottom:var(--lunix-backstage-bottom-clearance)!important;
  }
  body.lunix-backstage-page .lunix-backstage-content :is(input,textarea,button,select,[contenteditable="true"],a[href]){
    scroll-margin-bottom:var(--lunix-backstage-bottom-clearance);
  }
  body.lunix-backstage-page .lunix-backstage-mobile-bottom{
    z-index:100080!important;
    box-sizing:border-box!important;
    max-width:100vw!important;
    padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))!important;
  }
  /* Modal móvel central com fundo opaco, acima da barra e do dashboard. */
  body.lunix-backstage-page .lunix-backstage-notifications__backdrop[data-lunix-notifications-portal]{
    position:fixed!important;inset:0!important;
    display:block!important;
    width:100vw!important;height:100dvh!important;
    z-index:100400!important;
    background:rgba(0,0,0,.72)!important;
    border:0!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transition:opacity .18s ease,visibility .18s ease!important;
  }
  body.lunix-backstage-page.lunix-notifications-open .lunix-backstage-notifications__backdrop[data-lunix-notifications-portal]{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  }
  body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
    position:fixed!important;
    inset:auto!important;
    top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;
    width:min(420px,calc(100vw - 28px))!important;
    max-width:420px!important;
    height:auto!important;
    max-height:calc(100dvh - 40px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    padding:20px 18px!important;
    z-index:100410!important;
    border-radius:20px!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;
    transform:translate(-50%,-45%) scale(.97)!important;
    transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;
  }
  body.lunix-backstage-page.lunix-notifications-open .lunix-backstage-notifications__panel[data-lunix-notifications-portal]{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;
    transform:translate(-50%,-50%) scale(1)!important;
  }
  body.lunix-backstage-page .lunix-backstage-notifications__mobile-handle{display:none!important;}
  body.lunix-backstage-page .lunix-backstage-notifications__list{
    max-height:min(55dvh,400px)!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
  }
  body.lunix-backstage-page .lunix-backstage-notifications__empty{
    min-height:205px!important;max-height:none!important;padding:26px 12px!important;
  }
  body.lunix-backstage-page.lunix-notifications-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
}
@media(prefers-reduced-motion:reduce){
  body.lunix-backstage-page .lunix-backstage-notifications__panel[data-lunix-notifications-portal],
  body.lunix-backstage-page .lunix-backstage-notifications__backdrop[data-lunix-notifications-portal]{transition:none!important;}
}

/* Oct/16 -- mobile: dashboard admin em tema claro, perfil popover e ícones. */
@media(max-width:1023px){
  html[data-lunix-theme="light"] body.lunix-backstage-page.lunix-backstage-admin-dashboard-page .lunix-backstage-content .lunix-main-metrics .lunix-metric-card{
    background:linear-gradient(140deg,#fff 0%,#fff8fb 100%)!important;
    border-color:rgba(var(--lunix-portal-accent-rgb,230,0,115),.2)!important;
    box-shadow:0 10px 26px rgba(25,25,35,.055)!important;
  }
  html[data-lunix-theme="light"] body.lunix-backstage-page.lunix-backstage-admin-dashboard-page .lunix-backstage-content .lunix-main-metrics .lunix-metric-card__label{
    color:#414149!important;
  }
  html[data-lunix-theme="light"] body.lunix-backstage-page.lunix-backstage-admin-dashboard-page .lunix-backstage-content .lunix-main-metrics .lunix-metric-card__value,
  html[data-lunix-theme="light"] body.lunix-backstage-page.lunix-backstage-admin-dashboard-page .lunix-backstage-content .lunix-main-metrics .lunix-metric-card__value-row>.lunix-metric-card__value{
    color:#17171b!important;
  }
  /* Não criar outro quadrado sobre o sino. O badge numérico é preservado. */
  body.lunix-backstage-page .lunix-backstage-notifications__trigger::before,
  body.lunix-backstage-page .lunix-backstage-notifications__trigger::after{content:none!important;display:none!important}
  body.lunix-backstage-page .lunix-backstage-notifications__dot{display:none!important}
  /* Perfil associado ao avatar, jamais sheet inferior como o menu Mais. */
  body.lunix-backstage-page .lunix-topbar-profile-menu__dropdown{
    /* Ancora ao botão, não à viewport: backdrop-filter no header cria um
       containing block que deslocava menus position:fixed no mobile. */
    position:absolute!important;inset:auto!important;
    top:calc(100% + 8px)!important;
    left:auto!important;
    bottom:auto!important;right:0!important;
    box-sizing:border-box!important;
    width:min(300px,calc(100vw - 24px))!important;
    max-width:min(300px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - 100px - env(safe-area-inset-top,0px))!important;
    height:auto!important;min-height:0!important;
    border:1px solid rgba(var(--lunix-portal-accent-rgb,230,0,115),.22)!important;
    border-radius:16px!important;
    overflow-y:auto!important;
    padding:10px!important;
    box-shadow:0 18px 45px rgba(0,0,0,.3)!important;
    transform:translateY(-8px) scale(.985)!important;
    transition:transform .17s ease,opacity .17s ease,visibility .17s ease!important;
  }
  body.lunix-backstage-page .lunix-topbar-profile-menu:not(.is-open) .lunix-topbar-profile-menu__dropdown{
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-8px) scale(.985)!important;
  }
  body.lunix-backstage-page .lunix-topbar-profile-menu.is-open .lunix-topbar-profile-menu__dropdown{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0) scale(1)!important;
  }
  body.lunix-backstage-page .lunix-topbar-profile-menu__mobile-handle{display:none!important}
  body.lunix-backstage-page .lunix-topbar-profile-menu__backdrop,
  body.lunix-backstage-page .lunix-topbar-profile-menu.is-open .lunix-topbar-profile-menu__backdrop{
    background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
  /* Centraliza visualmente o desenho LX Academy no mesmo canvas do Suporte. */
  html body.lunix-backstage-page .lunix-backstage-mobile-bottom__item .lunix-backstage-menu-icon--unilunix::before{
    width:43px!important;height:41px!important;max-width:43px!important;max-height:41px!important;
    background-size:contain!important;background-position:center!important;
  }
}

/* 16/10: garantir leitura dos insights BIGO/TikTok em tema claro,
   inclusive contra as regras mobile de alta especificidade. */
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-period-summary__item,
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-dashboard-overview .lunix-period-summary__item{
  background:#fafafd!important;
  border-color:rgba(29,29,39,.12)!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-period-summary__item strong,
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-dashboard-overview .lunix-period-summary__item strong{
  color:#20202a!important;
  opacity:1!important;
  text-shadow:none!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-period-summary__item p,
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-dashboard-overview .lunix-period-summary__item p,
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-period-summary__comparison{
  color:#53535f!important;
  opacity:1!important;
}
html[data-lunix-theme="light"] body.lunix-backstage-page .lunix-period-summary__current{
  color:#20202a!important;
}
@media (max-width:1023px){
  /* Cabeçalho da conta: avatar e texto nunca podem se sobrepor. */
  html body.lunix-backstage-page .lunix-topbar-profile-menu__identity{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    gap:6px 11px!important;
    padding:9px 5px 12px!important;
    min-width:0!important;
  }
  html body.lunix-backstage-page .lunix-topbar-profile-menu__identity-avatar{
    grid-column:1!important;grid-row:1!important;
    width:48px!important;height:48px!important;min-width:48px!important;
  }
  html body.lunix-backstage-page .lunix-topbar-profile-menu__identity-copy{
    grid-column:2!important;grid-row:1!important;
    min-width:0!important;max-width:100%!important;
    margin:0!important;
  }
  html body.lunix-backstage-page .lunix-topbar-profile-menu__identity .lunix-topbar-profile-menu__portal-badge{
    grid-column:2!important;grid-row:2!important;
    justify-self:start!important;max-width:100%!important;
  }
}
