/* sg-dialog / sg-drawer — CSS do widget (P02, ADR-003/004), portado dos <style> de
 * dialog.card.html e drawer.card.html do bundle 8cd72241 (mesmo movimento do P01: CSS do
 * card portado 1:1). Partes, importadas abaixo:
 *   dialog-actions.css       botões .bt* do rodapé (card)
 *   dialog-modal.css         .md + 10 estilos cv1..cv10 (dialog.card)
 *   dialog-drawer.css        .dw + 10 designs dz1..dz10 (drawer.card)
 *   dialog-drawer-motion.css 10 animações an1..an10 (drawer.card)
 * Este arquivo traz só o scrim (camada do runtime) e o que POSICIONA o widget na página.
 */
@import url("dialog-actions.61395cc55a21.css");
@import url("dialog-modal.b39bfbb66117.css");
@import url("dialog-drawer.c9cd1e6c8f1f.css");
@import url("dialog-drawer-motion.1097e0bc0f82.css");

/* ── Scrim: o card o mostra como .stage; o runtime vem do Dialog.jsx do bundle ── */
.sg-scrim{
  position:fixed; inset:0; z-index:100; display:grid; background:var(--overlay-scrim);
  -webkit-backdrop-filter:blur(var(--overlay-blur)); backdrop-filter:blur(var(--overlay-blur));
  animation: sg-scrim-in var(--duration-base) var(--ease-out);
}
.sg-scrim--center{ place-items:center; padding:var(--space-6); }
.sg-scrim--right{ display:flex; justify-content:flex-end; overflow:hidden; } /* .stage do drawer.card */
.sg-scrim--confirm{ z-index:101; } /* confirmação de descarte, acima do overlay */
@scope ([data-dialog="sheet"]) to ([data-dialog]) { .sg-scrim--center/*data-dialog*/{ padding-bottom:0; } } /* estilo "folha": ancorada na borda inferior */
@keyframes sg-scrim-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes sg-modal-in{ from{ opacity:0; transform:translateY(8px) scale(.98); } to{ opacity:1; transform:none; } }
.sg-scrim:not(.sg-scrim--inline) .md{ animation: sg-modal-in var(--duration-slow) var(--ease-emphasized); }
/* saída: o inverso da entrada, mais curto; keyframes próprios porque uma animação CSS já concluída não reinicia ao inverter a direção */
@keyframes sg-scrim-out{ from{ opacity:1; } to{ opacity:0; } }
@keyframes sg-modal-out{ from{ opacity:1; transform:none; } to{ opacity:0; transform:translateY(8px) scale(.98); } }
.sg-scrim.is-closing{ animation: sg-scrim-out var(--duration-base) var(--ease-in) both; }
.sg-scrim.is-closing .md{ animation: sg-modal-out var(--duration-base) var(--ease-in) both; }
@media (prefers-reduced-motion: reduce){ .sg-scrim, .sg-scrim.is-closing, .sg-scrim .md, .sg-scrim.is-closing .md{ animation:none; } }

/* ── Modo inline (prévia na galeria e na matriz de eixos): sem overlay, no fluxo da página ── */
.sg-scrim--inline{
  position:relative; inset:auto; z-index:auto; overflow:hidden; animation:none;
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
.sg-scrim--inline.is-closing{ animation:none; } /* o estágio do card permanece; só o painel sai */
.sg-scrim--inline.sg-scrim--center{ min-height:260px; padding:34px 26px; }
.sg-scrim--inline.sg-scrim--right{ height:268px; } /* altura do .stage do drawer.card */
/* .stage do dialog.card: pilha de painéis estáticos sobre o scrim (prévia da galeria) */
.sg-scrim--stack{ display:flex; flex-direction:column; align-items:center; gap:28px; min-height:260px; padding:34px 26px; }
.sg-scrim__item{ display:flex; flex-direction:column; width:max-content; max-width:100%; } /* .mw do dialog.card */

/* ── Página e estados ── */
html.sg-scroll-lock{ overflow:hidden; }
.sg-dialog__content{ display:contents; } /* o conteúdo remoto herda o layout flex do painel */
.sg-scrim .sg-ov__notice{
  margin:0; padding:var(--space-3) var(--space-6); font-size:var(--text-sm);
  color:var(--negative-text); background:var(--negative-bg);
}
