/* Carrinho do pedido de atacado: ícone com selo no header, entrada no menu mobile,
   "Adicionar ao carrinho" na página do produto, o toast e a página /carrinho.
   Arquivo próprio, e não dentro do conta.css, para a Uranyx poder levar só ele.
   Mesmos tokens do resto do site: o bege dos painéis da conta, o escuro da lateral,
   o dourado #80725e dos detalhes, campos de 52 px com texto de 16 px. */

/* ---------- Header ---------- */
/* Botão redondo irmão da conta, .btn-outline de verdade para herdar o hover que sobe.
   O selo mora fora dele: o .btn tem overflow:hidden e cortaria o que passa da borda. */
.header-carrinho { position:relative; display:inline-flex; flex-shrink:0; }
.btn.header-carrinho-link { width:48px; height:48px; min-height:48px; padding:0; }
.header-carrinho-link i { font-size:20px; }
.header-carrinho-link.is-ativa { background:#fff; border-color:#1f1f1f; }
/* Contraste do branco sobre o dourado: 4,7:1. O anel da cor do header descola o selo do botão. */
.carrinho-selo {
    display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px; overflow:hidden;
    border-radius:var(--radius-full); background:#80725e; color:#fff;
    font:600 11px/1 var(--font-heading); letter-spacing:.01em; font-variant-numeric:tabular-nums;
}
.carrinho-selo[hidden] { display:none; }
/* O número antigo e o novo dividem a mesma célula enquanto um sai e o outro entra (carrinho.js). */
.carrinho-selo-num { grid-area:1/1; }
.header-carrinho-selo { position:absolute; top:-4px; right:-6px; z-index:1; box-shadow:0 0 0 2px #f6f5f3; pointer-events:none; }
/* Até 1099 px o menu inteiro só cabia sem folga, e o carrinho pede mais 58 px: ali os
   links do menu perdem um pouco de respiro para nada encostar no logo. */
@media (min-width:1000px) and (max-width:1099px) {
    .header-inner { gap:16px; }
    .desktop-nav a { padding-inline:14px; }
}
@media (max-width:999px) {
    .btn.header-carrinho-link { width:44px; height:44px; min-height:44px; background:#ffffffb3; }
    .header-carrinho-selo { top:-5px; right:-5px; }
}
/* Telas bem estreitas: três círculos e o logo precisam dividir 288 px. */
@media (max-width:374px) {
    .header-inner { gap:10px; }
    .header-actions { gap:6px; }
    .logo { width:118px; }
}

/* Menu mobile: o carrinho vem antes da conta, no mesmo formato de botão. */
.mobile-menu-bottom>.mobile-menu-carrinho { margin-bottom:10px; }
.mobile-menu-bottom>.mobile-menu-carrinho.is-ativa { background:#fff; border-color:#1f1f1f; }
.mobile-menu-carrinho .carrinho-selo { margin-left:-2px; }

/* ---------- Toast ---------- */
/* Desce logo abaixo do header, perto do ícone do carrinho; o carrinho.js mede onde o
   header termina. É só visual — o anúncio para leitor de tela é o role=status ao lado. */
.carrinho-toast {
    position:fixed; top:var(--carrinho-toast-topo,96px); right:var(--gutter); z-index:90;
    display:flex; align-items:center; gap:12px; width:max-content; max-width:min(460px,calc(100vw - 2 * var(--gutter)));
    padding:10px 10px 10px 12px; border-radius:22px; background:#1f1f1f; color:#f6f5f3;
    box-shadow:0 18px 40px #1f1f1f38; opacity:0; visibility:hidden; transform:translate3d(0,16px,0);
}
.carrinho-toast.is-visivel { opacity:1; visibility:visible; transform:none; }
.carrinho-toast-icone { flex-shrink:0; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#ffffff14; color:#ddc7a5; font-size:17px; }
.carrinho-toast-texto { flex:1; min-width:0; margin:0; font-size:14px; line-height:1.45; color:#d9d5ce; overflow-wrap:anywhere; }
.carrinho-toast-texto strong { display:block; font-weight:600; color:#fff; }
.carrinho-toast-link {
    flex-shrink:0; padding:11px 16px; border-radius:var(--radius-full); background:#f6f5f3; color:#1f1f1f;
    font:600 13px/1 var(--font-heading); white-space:nowrap; transition:background .3s;
}
.carrinho-toast-link:hover { background:#fff; }
.carrinho-toast.is-erro { background:#f8ece8; border:1px solid #e6c9bf; box-shadow:0 18px 40px #7a33251f; }
.carrinho-toast.is-erro .carrinho-toast-icone { background:#fff; color:#b4533f; }
.carrinho-toast.is-erro .carrinho-toast-texto,.carrinho-toast.is-erro .carrinho-toast-texto strong { color:#7a3325; }
.carrinho-toast.is-erro .carrinho-toast-link,.carrinho-toast.sem-link .carrinho-toast-link { display:none; }
@media (max-width:659px) {
    .carrinho-toast { left:var(--gutter); width:auto; max-width:none; }
    .carrinho-toast-texto { font-size:13px; }
}

/* ---------- Página do produto ---------- */
.carrinho-add { display:flex; flex-direction:column; gap:16px; }
.carrinho-add-campo { display:flex; flex-direction:column; gap:8px; min-width:0; }
.carrinho-add-campo>label { font-size:13px; font-weight:600; color:#2f2f2f; }
.carrinho-add-linha { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; }
.btn.carrinho-add-botao { flex:1 1 220px; min-height:52px; }
.carrinho-add-ver { align-self:flex-start; min-height:32px; }
.carrinho-add-ver[hidden] { display:none; }
.carrinho-add-ver [data-carrinho-ver-qtd] { display:inline-block; }
.carrinho-add[aria-busy=true] .carrinho-add-botao { cursor:progress; }

/* Botão com estado (carrinho.js): mais duas camadas no rótulo que rola do animations.css.
   Enviando, o rótulo sobe e entram três pontos; adicionado, os pontos sobem e entra o
   "✓ Adicionado"; na volta tudo desce, como o rótulo faz quando o ponteiro sai. O
   preenchimento escuro do hover sobe junto, para o estado valer também no toque e no Enter. */
.btn.has-motion>.button-busy,.btn.has-motion>.button-done {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:10px;
    padding:inherit; pointer-events:none; opacity:0; transform:translate3d(0,130%,0);
}
.button-busy { gap:6px; }
.button-busy>span { width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.9; }
.button-done i { color:#ddc7a5; font-size:1.1em; }
.btn-light .button-done i,.btn-outline .button-done i { color:#80725e; }
.btn.has-motion:is(.is-enviando,.is-adicionado)::before { transform:translate3d(0,0,0); }
.btn.has-motion:is(.is-enviando,.is-adicionado) .button-content,
.btn.has-motion:is(.is-enviando,.is-adicionado) .button-echo { transform:translate3d(0,-180%,0); opacity:0; }
.btn.has-motion.is-enviando>.button-busy,.btn.has-motion.is-adicionado>.button-done { transform:translate3d(0,0,0); opacity:1; }
.btn.has-motion.is-adicionado>.button-busy { transform:translate3d(0,-180%,0); opacity:0; }
.btn.has-motion.is-enviando:disabled { opacity:1; cursor:progress; }
.btn-outline.has-motion:is(.is-enviando,.is-adicionado) { color:#fff; border-color:#1f1f1f; }

/* Cor: o mesmo campo dos formulários da conta, com a bolinha da cor escolhida por dentro. */
.carrinho-cor { position:relative; }
.carrinho-cor select {
    width:100%; height:52px; padding:0 46px 0 48px; border:1px solid var(--color-border); border-radius:14px;
    -webkit-appearance:none; appearance:none; cursor:pointer; color:#1f1f1f; font:500 16px/1.2 var(--font-body);
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.6 6 6.4 11 1.6' stroke='%231f1f1f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 18px center/12px 8px;
    transition:border-color .3s;
}
.carrinho-cor select:hover { border-color:#1f1f1f40; }
.carrinho-cor select:focus-visible { outline:3px solid #89714e; outline-offset:2px; border-color:#89714e; }
.carrinho-cor-amostra {
    position:absolute; top:50%; left:16px; width:20px; height:20px; margin-top:-10px; border-radius:50%;
    background:var(--dot); box-shadow:inset 0 0 0 1px #1f1f1f24; pointer-events:none; transition:background .3s;
}

/* Quantidade: pílula com − e +. Os botões nascem hidden e o carrinho.js mostra;
   sem JS fica o campo numérico do navegador, com as setinhas dele. */
.carrinho-qtd {
    display:inline-flex; align-items:center; height:52px; padding:3px; border:1px solid var(--color-border);
    border-radius:var(--radius-full); background:#fff; transition:border-color .3s;
}
.carrinho-qtd:hover { border-color:#1f1f1f40; }
.carrinho-qtd:has(input:focus-visible) { outline:3px solid #89714e; outline-offset:2px; border-color:#89714e; }
.carrinho-qtd input {
    width:64px; height:100%; min-width:0; padding:0 4px; border:0; border-radius:var(--radius-full); background:transparent;
    color:#1f1f1f; font:600 16px/1 var(--font-heading); text-align:center; font-variant-numeric:tabular-nums;
}
.carrinho-qtd input:focus-visible { outline:none; }
.carrinho-qtd.is-pronto input { -moz-appearance:textfield; appearance:textfield; }
.carrinho-qtd.is-pronto input::-webkit-inner-spin-button,.carrinho-qtd.is-pronto input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.carrinho-qtd-passo {
    width:44px; height:44px; flex-shrink:0; display:grid; place-items:center; padding:0; border:0; border-radius:50%;
    background:transparent; color:#1f1f1f; font-size:16px; cursor:pointer; transition:background .3s,color .3s;
}
.carrinho-qtd-passo[hidden] { display:none; }
.carrinho-qtd-passo:hover { background:#1f1f1f0f; }
.carrinho-qtd-passo:active { background:#1f1f1f1f; }
.carrinho-qtd-passo:focus-visible { outline:2px solid #89714e; outline-offset:0; }
/* aria-disabled, e não disabled: o botão continua no Tab e o foco não cai no <body> ao chegar no 1. */
.carrinho-qtd-passo[aria-disabled=true] { color:#1f1f1f3d; background:transparent; cursor:not-allowed; }

/* ---------- Página do carrinho ---------- */
.carrinho .page-heading { margin-bottom:32px; }
.carrinho-alerta { margin-bottom:24px; }
.carrinho-principal { display:flex; flex-direction:column; gap:24px; min-width:0; container-type:inline-size; }
.carrinho-lista { margin:0; padding:0; list-style:none; border-top:1px solid var(--color-border); }
/* Atalho para o resumo: só quando ele cai para depois da lista (coluna única). */
.carrinho-atalho { display:none; align-self:flex-start; min-height:32px; color:#5f574a; }
.carrinho-resumo { scroll-margin-top:100px; }
@media (max-width:899px) { .carrinho-atalho { display:flex; margin-bottom:-6px; } }

/* Linha estreita (celular e a coluna ao lado do resumo): foto à esquerda, título em cima,
   quantidade e subtotal embaixo. Larga (a partir de 640 px de lista): tudo numa fileira. */
.carrinho-item {
    display:grid; grid-template-columns:96px minmax(0,1fr) auto 44px;
    grid-template-areas:"foto info info remover" "foto qtd subtotal subtotal";
    align-items:center; gap:12px 18px; padding:20px 0; border-bottom:1px solid var(--color-border);
    transition:opacity .3s;
}
.carrinho-item.is-atualizando { opacity:.55; }
.carrinho-item-foto { grid-area:foto; align-self:start; display:block; aspect-ratio:1; border-radius:18px; overflow:hidden; background:#ebe8e2; }
.carrinho-item-foto img { width:100%; height:100%; object-fit:cover; }
.carrinho-item-info { grid-area:info; display:flex; flex-direction:column; gap:6px; min-width:0; }
.carrinho-item-titulo { font-size:clamp(17px,1.4vw,19px); line-height:1.25; letter-spacing:-.02em; }
.carrinho-item-titulo a { text-decoration:underline; text-decoration-color:transparent; text-underline-offset:4px; transition:text-decoration-color .3s; }
.carrinho-item-titulo a:hover { text-decoration-color:currentColor; }
.carrinho-item-cor { display:flex; align-items:center; gap:8px; margin:0; font-size:13px; line-height:1.4; color:var(--color-muted); }
.carrinho-item-amostra { flex-shrink:0; width:14px; height:14px; border-radius:50%; background:var(--dot); box-shadow:inset 0 0 0 1px #1f1f1f24; }
.carrinho-item-unitario { margin:0; font:600 14px/1.35 var(--font-heading); color:var(--color-dark); }
.carrinho-item-unitario span { font:500 12px/1.35 var(--font-body); color:var(--color-muted); }
.carrinho-item-qtd { grid-area:qtd; justify-self:start; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.carrinho-qtd.is-compacto { height:48px; padding:2px; }
.carrinho-qtd.is-compacto input { width:56px; }
.carrinho-item-atualizar {
    min-height:44px; padding:0 16px; border:1px solid var(--color-border); border-radius:var(--radius-full);
    background:#fff; color:#1f1f1f; font:600 13px/1 var(--font-heading); transition:background .3s,color .3s,border-color .3s;
}
.carrinho-item-atualizar:hover { background:#1f1f1f; border-color:#1f1f1f; color:#f6f5f3; }
.carrinho-item-atualizar[hidden] { display:none; }
.carrinho-item-subtotal { grid-area:subtotal; justify-self:end; margin:0; font:600 17px/1.2 var(--font-heading); letter-spacing:-.02em; color:var(--color-dark); white-space:nowrap; font-variant-numeric:tabular-nums; }
.carrinho-item-remover { grid-area:remover; justify-self:end; align-self:start; }
.carrinho-item-remover-botao {
    width:44px; height:44px; display:grid; place-items:center; padding:0; border:1px solid transparent; border-radius:50%;
    background:transparent; color:#6f6657; font-size:18px; transition:background .3s,color .3s,border-color .3s;
}
.carrinho-item-remover-botao:hover { background:#f8ece8; border-color:#e6c9bf; color:#7a3325; }
.carrinho-item-remover-botao:focus-visible { outline:2px solid #89714e; outline-offset:2px; }
@container (min-width:640px) {
    .carrinho-item { grid-template-columns:104px minmax(0,1fr) auto 44px; grid-template-areas:"foto info qtd remover"; gap:12px 22px; }
    .carrinho-lista.tem-preco .carrinho-item { grid-template-columns:104px minmax(0,1fr) auto minmax(104px,auto) 44px; grid-template-areas:"foto info qtd subtotal remover"; }
    .carrinho-item-foto,.carrinho-item-remover { align-self:center; }
}
@container (max-width:419px) {
    .carrinho-item { grid-template-columns:72px minmax(0,1fr) auto 44px; grid-template-areas:"foto info info remover" "qtd qtd subtotal subtotal"; gap:14px 14px; }
    .carrinho-item-foto { border-radius:14px; }
}

.carrinho-lista-acoes { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 20px; }
.carrinho-lista-acoes>form { display:contents; }
.carrinho-esvaziar {
    display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 6px; border:0; background:none;
    color:#6f6657; font:600 13px/1 var(--font-heading); text-decoration:underline; text-decoration-color:transparent;
    text-underline-offset:4px; transition:color .3s,text-decoration-color .3s;
}
.carrinho-esvaziar i { font-size:16px; }
.carrinho-esvaziar:hover { color:#7a3325; text-decoration-color:currentColor; }

/* Resumo: a coluna escura das páginas da conta, com o total e o botão de finalizar. */
.conta-lateral.carrinho-resumo { gap:18px; }
.carrinho-resumo>h2 { font-size:clamp(22px,2vw,28px); }
.carrinho-resumo>.btn { width:100%; }
.carrinho-resumo a:not(.btn) { color:#ddc7a5; font-weight:600; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.carrinho-resumo a:not(.btn):hover { text-decoration-thickness:2px; }
.conta-lateral .carrinho-nota { font-size:13px; line-height:1.55; }
.carrinho-total { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px; width:100%; margin:0; padding-top:18px; border-top:1px solid #ffffff1f; }
.carrinho-total dt { font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#c7b8a1; }
.carrinho-total dd { margin:0; font:600 clamp(28px,2.6vw,36px)/1 var(--font-heading); letter-spacing:-.03em; color:#f6f5f3; white-space:nowrap; font-variant-numeric:tabular-nums; }
.carrinho-minimo { display:flex; flex-direction:column; gap:10px; width:100%; }
.carrinho-minimo-barra { display:block; height:6px; border-radius:var(--radius-full); background:#ffffff1a; overflow:hidden; }
.carrinho-minimo-barra>span { display:block; height:100%; border-radius:inherit; background:#ddc7a5; transition:width .6s var(--ease-reveal,ease); }
.conta-lateral .carrinho-minimo p { margin:0; font-size:13px; line-height:1.5; }
.carrinho-minimo.is-atingido p { display:flex; align-items:center; gap:8px; color:#ddc7a5; }
.carrinho-minimo.is-atingido i { font-size:17px; }
.carrinho-finalizar[aria-disabled=true] { opacity:.6; cursor:progress; }

/* Depois de abrir o WhatsApp: a pergunta que decide se o carrinho esvazia. */
.carrinho-confirmar { display:flex; flex-direction:column; gap:10px; width:100%; padding:18px; border:1px solid #ffffff24; border-radius:18px; background:#ffffff0d; }
.carrinho-confirmar[hidden] { display:none; }
.carrinho-confirmar:focus { outline:none; }
.carrinho-confirmar:focus-visible { outline:2px solid #ddc7a5; outline-offset:3px; }
.conta-lateral .carrinho-confirmar p { margin:0; font-size:13px; line-height:1.55; }
.conta-lateral .carrinho-confirmar p strong { font-size:15px; white-space:normal; }
.carrinho-confirmar-acoes { display:flex; flex-wrap:wrap; gap:10px; margin-top:4px; }
.carrinho-confirmar-acoes>form { display:contents; }
.carrinho-confirmar .btn { flex:1 1 auto; padding:13px 18px; font-size:13px; }

/* Vazio: o painel bege das páginas da conta, com o convite para o catálogo. */
.carrinho-vazio { display:flex; flex-direction:column; align-items:flex-start; gap:18px; max-width:640px; padding:clamp(26px,4vw,44px); border-radius:28px; background:#eeece8; }
.carrinho-vazio-icone { width:56px; height:56px; display:grid; place-items:center; border-radius:50%; background:#fff; color:#80725e; font-size:26px; }
.carrinho-vazio h2 { font-size:clamp(26px,2.7vw,36px); line-height:1.1; letter-spacing:-.03em; }
.carrinho-vazio p { max-width:52ch; font-size:15px; line-height:1.65; color:#5f5f5f; }

@media (max-width:659px) {
    .carrinho-lista-acoes>.btn { width:100%; }
    .carrinho-lista-acoes { justify-content:center; }
    .carrinho-vazio .btn { width:100%; }
}
/* ---------- Movimento ---------- */
/* Nada muda seco: a curva e os tempos são os do animations.css (--ease-reveal, 0,65 s
   para o rótulo rolar, 0,4 s para apagar, --time-reveal para o que chega). O que precisa
   de medida (linha que fecha, painel que abre, valor que rola) é Web Animations no
   carrinho.js, que confere prefers-reduced-motion antes de animar. */
@keyframes carrinho-pulso { 0% { transform:scale(1); } 35% { transform:scale(1.25); } 100% { transform:scale(1); } }
@keyframes carrinho-selo-entra { 0% { transform:scale(0); opacity:0; } 55% { transform:scale(1.25); opacity:1; } 100% { transform:scale(1); opacity:1; } }
@keyframes carrinho-selo-sai { from { transform:scale(1); opacity:1; } to { transform:scale(0); opacity:0; } }
@keyframes carrinho-num-entra { from { transform:translate3d(0,110%,0); opacity:0; } to { transform:none; opacity:1; } }
@keyframes carrinho-num-sai { from { transform:none; opacity:1; } to { transform:translate3d(0,-110%,0); opacity:0; } }
@keyframes carrinho-num-entra-desce { from { transform:translate3d(0,-110%,0); opacity:0; } to { transform:none; opacity:1; } }
@keyframes carrinho-num-sai-desce { from { transform:none; opacity:1; } to { transform:translate3d(0,110%,0); opacity:0; } }
@keyframes carrinho-sobe-leve { from { transform:translate3d(0,8px,0); opacity:0; } to { transform:none; opacity:1; } }
@keyframes carrinho-icone-entra { 0% { transform:scale(.4) rotate(-12deg); opacity:0; } 60% { transform:scale(1.12); opacity:1; } 100% { transform:none; opacity:1; } }
@keyframes carrinho-pontos { 0%,80%,100% { transform:translate3d(0,0,0); opacity:.35; } 40% { transform:translate3d(0,-4px,0); opacity:1; } }
@media (prefers-reduced-motion:no-preference) {
    .carrinho-selo.is-pulsando { animation:carrinho-pulso .6s var(--ease-reveal); }
    .carrinho-selo.is-entrando { animation:carrinho-selo-entra .7s var(--ease-reveal) both; }
    .carrinho-selo.is-saindo { animation:carrinho-selo-sai .45s var(--ease-reveal) both; }
    .carrinho-selo-num.is-chegando { animation:carrinho-num-entra .55s var(--ease-reveal) both; }
    .carrinho-selo-num.is-saindo { animation:carrinho-num-sai .45s var(--ease-reveal) both; }
    .carrinho-selo.is-descendo .carrinho-selo-num.is-chegando { animation-name:carrinho-num-entra-desce; }
    .carrinho-selo.is-descendo .carrinho-selo-num.is-saindo { animation-name:carrinho-num-sai-desce; }

    /* Toast: sobe enquanto aparece; some só apagando, e volta para baixo já invisível. */
    .carrinho-toast { transition:opacity .4s ease,transform 0s linear .45s,visibility 0s linear .45s; }
    .carrinho-toast.is-visivel { transition:opacity .45s ease,transform .75s var(--ease-reveal),visibility 0s; }
    .carrinho-toast.is-visivel .carrinho-toast-icone i { animation:carrinho-icone-entra .7s var(--ease-reveal) .1s both; }
    .carrinho-toast-texto.is-trocando { animation:carrinho-sobe-leve .5s var(--ease-reveal) both; }

    .btn.has-motion>.button-busy,.btn.has-motion>.button-done { transition:transform .65s var(--ease-reveal),opacity .4s; }
    .button-busy>span { animation:carrinho-pontos .9s ease-in-out infinite; }
    .button-busy>span:nth-child(2) { animation-delay:.15s; }
    .button-busy>span:nth-child(3) { animation-delay:.3s; }
    .carrinho-add-ver.is-chegando { animation:charlots-fade-left .8s var(--ease-reveal) both; }
    .carrinho-add-ver [data-carrinho-ver-qtd].is-trocando { animation:carrinho-sobe-leve .45s var(--ease-reveal) both; }

    /* − e + afundam um pouco no clique e voltam com a curva do site. */
    .carrinho-qtd-passo { transition:background .3s,color .3s,transform .45s var(--ease-reveal); }
    .carrinho-qtd-passo:active:not([aria-disabled=true]) { transform:scale(.86); transition-duration:.3s,.3s,.12s; }

    /* O "Finalizar" esmaece enquanto a quantidade grava, sem piscar. */
    .btn.has-motion.carrinho-finalizar { transition:color .45s,border-color .45s,box-shadow .55s var(--ease-reveal),transform .55s var(--ease-reveal),opacity .35s; }

    /* Carrinho vazio chegando: a revelação do site, em cascata. */
    .carrinho-vazio.is-chegando { animation:charlots-fade-scale .9s var(--ease-reveal) both; }
    .carrinho-vazio.is-chegando>* { animation:charlots-fade-bottom var(--time-reveal) var(--ease-reveal) both; }
    .carrinho-vazio.is-chegando>:nth-child(1) { animation-name:carrinho-icone-entra; animation-duration:.8s; animation-delay:.12s; }
    .carrinho-vazio.is-chegando>:nth-child(2) { animation-delay:.2s; }
    .carrinho-vazio.is-chegando>:nth-child(3) { animation-delay:.28s; }
    .carrinho-vazio.is-chegando>:nth-child(4) { animation-delay:.36s; }
}
@media (prefers-reduced-motion:reduce) {
    .carrinho-toast,.carrinho-item,.carrinho-minimo-barra>span,.carrinho-qtd,.carrinho-qtd-passo,.carrinho-cor select,.carrinho-cor-amostra,
    .btn.has-motion>.button-busy,.btn.has-motion>.button-done { transition:none; }
    .carrinho-selo,.carrinho-selo-num,.button-busy>span,.carrinho-vazio,.carrinho-vazio>*,.carrinho-add-ver,.carrinho-toast-texto { animation:none; }
    .carrinho-selo-num.is-saindo { display:none; }
}