/* =========================================================
   ZH OUTFITS — MENU DE COMPARTILHAR (celular)
   Painel que sobe da parte de baixo da tela com WhatsApp,
   Instagram Direct, copiar link e mais.
   Lógica em js/compartilhar-menu.js.
   ========================================================= */
.share-sheet{ position:fixed; inset:0; z-index:120; }
.share-sheet[hidden]{ display:none; }

.share-sheet__fundo{
  position:absolute; inset:0; background:rgba(0,0,0,.6);
  opacity:0; transition:opacity .25s ease;
}
.share-sheet__painel{
  position:absolute; left:0; right:0; bottom:0;
  padding:10px 18px calc(18px + env(safe-area-inset-bottom));
  background:var(--surface); border-top:1px solid var(--gold);
  border-radius:18px 18px 0 0;
  box-shadow:0 -16px 40px rgba(0,0,0,.6);
  transform:translateY(100%); transition:transform .28s cubic-bezier(.2,.8,.2,1);
}
.share-sheet.is-aberto .share-sheet__fundo{ opacity:1; }
.share-sheet.is-aberto .share-sheet__painel{ transform:translateY(0); }

.share-sheet__alca{ width:40px; height:4px; margin:0 auto 14px; border-radius:99px; background:var(--line); }
.share-sheet__titulo{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); text-align:center; }
.share-sheet__nome{ font-weight:600; text-align:center; margin:4px 0 18px; }

.share-sheet__opcoes{ display:flex; justify-content:space-around; gap:8px; }
.share-sheet__opcoes button{
  flex:1; max-width:84px;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  background:none; border:0; padding:0; color:var(--text);
  font-size:.72rem; font-weight:600; cursor:pointer;
}
.share-sheet__icone{
  width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--surface-2); border:1px solid var(--line); color:var(--gold-hi);
  transition:transform .15s ease;
}
.share-sheet__icone svg{ display:block; }
.share-sheet__opcoes button:active .share-sheet__icone{ transform:scale(.92); }
.share-sheet__icone--wpp{ background:var(--wpp); border-color:var(--wpp); color:#fff; }
.share-sheet__icone--insta{
  background:linear-gradient(45deg, #f9ce34, #ee2a7b 55%, #6228d7);
  border-color:transparent; color:#fff;
}

.share-sheet__aviso{
  margin-top:16px; padding:9px 12px; border-radius:var(--r-sm);
  background:var(--gold); color:#100c02;
  font-size:.8rem; font-weight:700; text-align:center;
}
.share-sheet__cancelar{
  display:block; width:100%; margin-top:16px; padding:12px;
  background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm);
  color:var(--muted); font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
}

/* aviso rápido na parte de baixo da tela (ex: "Link copiado!") */
.share-toast{
  position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom)); z-index:130;
  max-width:calc(100% - 32px); padding:11px 16px; border-radius:var(--r-sm);
  background:var(--gold); color:#100c02; box-shadow:0 10px 30px rgba(0,0,0,.5);
  font-size:.82rem; font-weight:700; text-align:center;
  opacity:0; transform:translate(-50%, 12px); pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.share-toast.is-visivel{ opacity:1; transform:translate(-50%, 0); }
