/* ============================================================
   BLACK FRIDAY — faixa do topo, popup, aviso no carrinho/checkout.
   Carregado só durante a campanha (inc/black-friday.php).
   ============================================================ */

/* mostra/esconde por fase: [data-show="pre"], [data-show="live"], "pre off"... */
.aly-bf-scope[data-bf-phase="pre"]  [data-show]:not([data-show~="pre"]),
.aly-bf-scope[data-bf-phase="live"] [data-show]:not([data-show~="live"]),
.aly-bf-scope[data-bf-phase="off"]  [data-show]:not([data-show~="off"]){ display:none !important; }

/* ---------- cronômetro ---------- */
.aly-bf-count{ display:inline-flex; align-items:baseline; gap:8px; }
.aly-bf-unit{ display:inline-flex; align-items:baseline; gap:2px; }
.aly-bf-unit b{ font-weight:600; font-variant-numeric:tabular-nums; color:var(--white); }
.aly-bf-unit small{ font-size:var(--fs-12); color:var(--gold-400); }

/* ---------- faixa do topo ---------- */
.aly-utility--bf{
  background:linear-gradient(90deg, var(--ink) 0%, #231a10 50%, var(--ink) 100%);
  border-bottom:1px solid rgba(214,170,110,.35);
}
.aly-utility--bf .aly-utility__row{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
  height:auto; min-height:72px; padding-block:8px;
  transition:min-height var(--dur-ui) var(--ease);
}
.aly-utility--bf .aly-utility__coupon{ justify-self:end; }
.aly-utility--bf .aly-utility__local{ justify-self:start; }
.aly-bf-center{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.aly-bf-title{
  font-family:var(--ff-display); font-size:var(--fs-24); line-height:1; letter-spacing:.02em; color:var(--white);
}
.aly-bf-title em{ font-style:normal; color:var(--gold-400); }
.aly-bf-title b{ font-weight:400; color:var(--gold-400); }
.aly-bf-sub{ display:flex; align-items:baseline; justify-content:center; gap:8px; font-size:var(--fs-12); color:rgba(255,255,255,.75); }
.aly-bf-sub .aly-bf-count{ font-size:var(--fs-14); }
/* "Black Friday:" só aparece no modo retraído do celular (veja o @media abaixo) */
.aly-bf-sub__brand{ display:none; font-weight:700; color:var(--gold-400); }
.aly-bf-dates{ padding-left:8px; border-left:1px solid rgba(255,255,255,.25); letter-spacing:.04em; }

.aly-bf-apply{
  height:40px; padding:0 24px; border-radius:var(--radius-full);
  background:var(--gold-400); color:var(--ink); font-size:var(--fs-14); font-weight:700;
  transition:background var(--dur-hover) var(--ease), transform var(--dur-hover) var(--ease);
}
.aly-bf-apply:hover:not(:disabled){ background:var(--white); transform:translateY(-1px); }
.aly-bf-apply.is-applied{ background:transparent; color:var(--gold-400); border:1.5px solid var(--gold-400); cursor:default; }
.aly-bf-apply:disabled{ opacity:1; }

/* ao rolar: a faixa encolhe pra não ocupar a tela inteira */
.aly-sticky-top.is-scrolled .aly-utility--bf .aly-utility__row{ min-height:40px; padding-block:0; }
.aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-center{ flex-direction:row; gap:16px; }
.aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-title{ font-size:var(--fs-14); }
.aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-dates{ display:none; }
.aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-apply{ height:32px; padding:0 16px; font-size:var(--fs-12); }

/* após o fim da campanha (página antiga em cache): volta à barra normal */
.aly-utility--bf[data-bf-phase="off"] .aly-bf-center{ display:none; }
.aly-utility--bf[data-bf-phase="off"] .aly-utility__row{ min-height:38px; display:flex; justify-content:space-between; }

@media(max-width:720px){
  .aly-utility--bf .aly-utility__row{
    grid-template-columns:1fr; grid-template-areas:"center" "right";
    gap:12px; min-height:0; padding:12px;
  }
  .aly-bf-center{ grid-area:center; }
  /* no celular, durante a campanha: sem o aviso de Maringá (poluía) */
  .aly-utility--bf .aly-utility__local{ display:none; }
  /* cupom/botão centralizado, separado do aviso por uma linha discreta */
  .aly-utility--bf .aly-utility__coupon{
    grid-area:right; justify-self:stretch; justify-content:center;
    padding-top:12px; border-top:1px solid rgba(255,255,255,.14);
  }
  .aly-bf-title{ font-size:16px; }
  .aly-bf-apply{ height:32px; padding:0 16px; font-size:var(--fs-12); }
  /* rolando no celular: sobra só o cronômetro (a barra fixa não pode comer a tela) */
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-utility__row{ padding:8px 12px; }
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-title,
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-utility__local,
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-utility__coupon{ display:none; }
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-utility__row{ grid-template-areas:"center"; }
  /* retraído: "Black Friday: Começa em 00d 00h 00m 00s", tudo junto e centralizado */
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-center{ width:100%; justify-content:center; }
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-sub{ justify-content:center; flex-wrap:wrap; gap:4px 8px; text-align:center; }
  .aly-sticky-top.is-scrolled .aly-utility--bf .aly-bf-sub__brand{ display:inline; }
}

/* ---------- popup preto ---------- */
.aly-bf-pop-overlay{
  position:fixed; inset:0; z-index:96; padding:24px;
  background:rgba(21,21,21,.72);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity var(--dur-ui) var(--ease);
}
.aly-bf-pop-overlay.is-open{ opacity:1; pointer-events:all; }
.aly-bf-pop{
  position:relative; width:100%; max-width:440px; padding:48px 32px 32px; text-align:center;
  background:radial-gradient(120% 80% at 50% 0%, #2c2012 0%, var(--ink) 60%);
  color:var(--white); border-radius:var(--radius-l); border:1px solid rgba(214,170,110,.35);
  transform:translateY(16px) scale(.98); transition:transform var(--dur-ui) var(--ease);
}
.aly-bf-pop-overlay.is-open .aly-bf-pop{ transform:none; }
.aly-bf-pop__x{ position:absolute; top:16px; right:16px; width:32px; height:32px; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.6); }
.aly-bf-pop__x:hover{ color:var(--white); }
.aly-bf-pop__eyebrow{ font-size:var(--fs-12); letter-spacing:.2em; text-transform:uppercase; color:var(--gold-400); }
.aly-bf-pop__title{ font-family:var(--ff-display); font-size:var(--fs-64); line-height:1; margin:16px 0; color:var(--white); }
.aly-bf-pop__text{ font-size:var(--fs-14); line-height:1.5; color:rgba(255,255,255,.8); margin:0 0 24px; }
.aly-bf-pop__timer{ display:flex; align-items:baseline; justify-content:center; gap:8px; font-size:var(--fs-12); color:rgba(255,255,255,.7); margin-bottom:24px; }
.aly-bf-pop__timer .aly-bf-count{ font-size:var(--fs-24); }
.aly-bf-pop__btn{
  width:100%; height:56px; border-radius:var(--radius-full);
  background:var(--gold-400); color:var(--ink); font-size:15px; font-weight:700;
  transition:background var(--dur-hover) var(--ease);
}
.aly-bf-pop__btn:hover:not(:disabled){ background:var(--white); }
.aly-bf-pop__btn.is-applied{ background:transparent; color:var(--gold-400); border:1.5px solid var(--gold-400); }
.aly-bf-pop__later{ margin-top:16px; font-size:var(--fs-12); color:rgba(255,255,255,.55); text-decoration:underline; }
.aly-bf-pop__later:hover{ color:var(--white); }
@media(max-width:720px){ .aly-bf-pop__title{ font-size:var(--fs-48); } }

/* ---------- aviso no Carrinho / Checkout ---------- */
.aly-bf-notice{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin:16px 0; padding:16px; border-radius:var(--radius-m);
  background:var(--ink); color:var(--white); font-size:var(--fs-12); line-height:1.4;
}
.aly-bf-notice b{ color:var(--gold-400); }
.aly-bf-notice button{
  flex-shrink:0; height:40px; padding:0 16px; border-radius:var(--radius-full);
  background:var(--gold-400); color:var(--ink); font-size:var(--fs-12); font-weight:700;
}
.aly-bf-notice button:hover{ background:var(--white); }
