/* ========================================================================== 
   Alfred Experience v1 — loading compartilhado + motion progressivo
   Esta folha fica por último para unificar somente a camada de apresentação.
   ========================================================================== */

:root{
  --alfred-motion-ease:cubic-bezier(.22,1,.36,1);
}

/* --------------------------------------------------------------------------
   Loading único e textual em tela cheia e em listas.
   -------------------------------------------------------------------------- */
#loader-overlay,
.spinner-wrap{
  color:#0b0b0a!important;
  text-align:center!important;
}

#loader-overlay{
  gap:17px!important;
  padding:max(22px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;
  background:rgba(248,247,242,.975)!important;
}

#loader-overlay.active,
html.alfred-partner-booting #loader-overlay,
html.alfred-data-booting #loader-overlay{
  animation:alfredLoaderSurfaceIn .2s ease-out both;
}

/* Rotas dependentes de dados só são liberadas depois da composição completa. */
html.alfred-data-booting #screen-busca,
html.alfred-data-booting #screen-detalhe,
html.alfred-data-booting #screen-cadastro,
html.alfred-data-booting #screen-consumer-login,
html.alfred-data-booting #screen-conta,
html.alfred-data-booting #screen-partner-login,
html.alfred-data-booting #screen-partner-signup,
html.alfred-data-booting #screen-partner-dashboard{
  display:none!important;
}

html.alfred-data-booting #loader-overlay{
  display:flex!important;
}

.spinner-wrap{
  width:100%!important;
  min-height:clamp(190px,25vh,240px)!important;
  padding:34px 18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:15px!important;
  box-sizing:border-box!important;
}

/* Remove qualquer barra, spinner ou marca herdados das folhas antigas. */
#loader-overlay::before,
#loader-overlay::after,
.spinner-wrap::before,
.spinner-wrap::after{
  content:none!important;
  display:none!important;
}

#loader-overlay .loader-spinner,
.spinner-wrap .spinner,
.alfred-loader-progress{
  display:none!important;
}

.alfred-loader-mark{
  display:block!important;
  width:clamp(108px,12vw,138px)!important;
  max-width:42vw!important;
  height:auto!important;
  max-height:96px!important;
  margin:0 auto!important;
  object-fit:contain!important;
  background:transparent!important;
  filter:none!important;
}

#loader-overlay .loader-title,
.spinner-wrap .spinner-text{
  width:min(100%,480px)!important;
  margin:0 auto!important;
  color:#0b0b0a!important;
  font-family:var(--alf-font-display,'Space Grotesk','Manrope',sans-serif)!important;
  font-size:clamp(19px,2.2vw,24px)!important;
  line-height:1.08!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  text-wrap:balance;
  transition:opacity .16s ease,transform .16s ease!important;
}

#loader-overlay .loader-sub{
  display:none!important;
}

.loader-title.alfred-loading-changing,
.spinner-text.alfred-loading-changing{
  opacity:.28!important;
  transform:translateY(2px)!important;
}

.alfred-loader-sr{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@keyframes alfredLoaderSurfaceIn{
  from{opacity:0}
  to{opacity:1}
}

/* --------------------------------------------------------------------------
   Abertura e composição. As classes são efêmeras e nunca controlam display,
   posição de rolagem, rotas ou estado funcional dos componentes.
   -------------------------------------------------------------------------- */
.alfred-view-enter>header,
.alfred-view-enter>.partner-topbar,
.alfred-view-enter>.alfred-unified-header,
.alfred-view-enter>.cad-header{
  animation:alfredPageChromeIn .32s ease-out both;
}

.alfred-view-enter>.det-inner,
.alfred-view-enter>#cad-conteudo,
.alfred-view-enter>.partner-shell,
.alfred-view-enter>.auth-shell,
.alfred-view-enter>.partner-status-banner,
.alfred-view-enter>.conta-tab-content.active{
  animation:alfredPageContentIn .48s var(--alfred-motion-ease) .045s both;
}

.alfred-view-enter>.partner-tabs,
.alfred-view-enter>.conta-tabs-top{
  animation:alfredPageChromeIn .34s ease-out .025s both;
}

.alfred-panel-enter{
  animation:alfredPanelIn .36s var(--alfred-motion-ease) both!important;
}

.alfred-compose-item{
  animation:alfredComposeIn .44s var(--alfred-motion-ease) var(--alfred-motion-delay,0ms) both!important;
}

.modal-overlay>:first-child,
.conta-perfil-page{
  animation:none!important;
}

.modal-overlay.alfred-modal-enter{
  animation:alfredBackdropIn .2s ease-out both!important;
}

.modal-overlay.alfred-modal-enter>:first-child{
  animation:alfredDialogIn .38s var(--alfred-motion-ease) .02s both!important;
}

.conta-perfil-page.alfred-profile-enter{
  animation:alfredProfileIn .4s var(--alfred-motion-ease) both!important;
}

body.alfred-auth-enter .auth-header{
  animation:alfredPageChromeIn .32s ease-out both;
}

body.alfred-auth-enter .auth-main .auth-shell{
  animation:alfredPageContentIn .5s var(--alfred-motion-ease) .04s both;
}

.alfred-score-counting{
  font-variant-numeric:tabular-nums!important;
}

.alfred-score-progressing .vsc-score-marker,
.alfred-score-progressing .score-scale-marker{
  transition:left .88s var(--alfred-motion-ease)!important;
}

@keyframes alfredPageChromeIn{
  from{opacity:0;transform:translateY(-7px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes alfredPageContentIn{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes alfredPanelIn{
  from{opacity:0;transform:translateY(9px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes alfredComposeIn{
  from{opacity:0;transform:translateY(12px) scale(.992)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes alfredBackdropIn{
  from{opacity:0}
  to{opacity:1}
}

@keyframes alfredDialogIn{
  from{opacity:0;transform:translateY(18px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes alfredProfileIn{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

@media(max-width:640px){
  .spinner-wrap{
    min-height:184px!important;
    padding:30px 14px!important;
  }

  .alfred-loader-mark{width:108px!important;max-height:76px!important}

  #loader-overlay .loader-title,
  .spinner-wrap .spinner-text{
    max-width:310px!important;
    font-size:19px!important;
  }

  #loader-overlay .loader-sub{
    max-width:310px!important;
    font-size:11px!important;
  }

  .modal-overlay.alfred-modal-enter>:first-child{
    animation-name:alfredDialogMobileIn!important;
  }

  @keyframes alfredDialogMobileIn{
    from{opacity:.35;transform:translateY(24px)}
    to{opacity:1;transform:translateY(0)}
  }
}

@media(prefers-reduced-motion:reduce){
  #loader-overlay.active,
  html.alfred-partner-booting #loader-overlay,
  html.alfred-data-booting #loader-overlay,
  .alfred-view-enter>header,
  .alfred-view-enter>.partner-topbar,
  .alfred-view-enter>.alfred-unified-header,
  .alfred-view-enter>.cad-header,
  .alfred-view-enter>.det-inner,
  .alfred-view-enter>#cad-conteudo,
  .alfred-view-enter>.partner-shell,
  .alfred-view-enter>.auth-shell,
  .alfred-view-enter>.partner-status-banner,
  .alfred-view-enter>.conta-tab-content.active,
  .alfred-view-enter>.partner-tabs,
  .alfred-view-enter>.conta-tabs-top,
  .alfred-panel-enter,
  .alfred-compose-item,
  .modal-overlay.alfred-modal-enter,
  .modal-overlay.alfred-modal-enter>:first-child,
  .conta-perfil-page.alfred-profile-enter,
  body.alfred-auth-enter .auth-header,
  body.alfred-auth-enter .auth-main .auth-shell{
    animation:none!important;
  }

  .loader-title,
  .spinner-text,
  .alfred-score-progressing .vsc-score-marker,
  .alfred-score-progressing .score-scale-marker{
    transition:none!important;
  }
}