/* ============================================================
   Shiny CTA button style — applied to every button on the site
   Base: black + white shine.  .lc-btn-green => black + green.
   ============================================================ */

@property --gradient-angle{syntax:"<angle>";initial-value:0deg;inherits:false}
@property --gradient-angle-offset{syntax:"<angle>";initial-value:0deg;inherits:false}
@property --gradient-percent{syntax:"<percentage>";initial-value:5%;inherits:false}
@property --gradient-shine{syntax:"<color>";initial-value:white;inherits:false}

.lc-btn,
.lc-btn-gold,.lc-btn-dark,.lc-btn-orange,.lc-btn-green,
.lc-btn-outline-gold,.lc-btn-outline-white,
.shiny-cta{
  --shiny-cta-bg:#000000;
  --shiny-cta-bg-subtle:#1a1818;
  --shiny-cta-fg:#ffffff;
  --shiny-cta-highlight:#ffffff;
  --shiny-cta-highlight-subtle:#bfbfbf;
  --animation:gradient-angle linear infinite;
  --duration:3s;
  --shadow-size:2px;
  --transition:800ms cubic-bezier(.25,1,.5,1);
  isolation:isolate;
  position:relative;
  overflow:hidden;
  cursor:pointer;
  outline-offset:4px;
  text-decoration:none;
  border:1px solid transparent !important;
  border-radius:360px !important;
  color:var(--shiny-cta-fg) !important;
  background:
    linear-gradient(var(--shiny-cta-bg),var(--shiny-cta-bg)) padding-box,
    conic-gradient(
      from calc(var(--gradient-angle) - var(--gradient-angle-offset)),
      transparent,
      var(--shiny-cta-highlight) var(--gradient-percent),
      var(--gradient-shine) calc(var(--gradient-percent) * 2),
      var(--shiny-cta-highlight) calc(var(--gradient-percent) * 3),
      transparent calc(var(--gradient-percent) * 4)
    ) border-box !important;
  box-shadow:inset 0 0 0 1px var(--shiny-cta-bg-subtle) !important;
  transition:var(--transition);
  transition-property:--gradient-angle-offset,--gradient-percent,--gradient-shine;
  animation:
    var(--animation) var(--duration),
    var(--animation) calc(var(--duration) / .4) reverse paused !important;
  animation-composition:add;
}

.lc-btn > span,
.shiny-cta span{
  position:relative;
  z-index:1;
  color:#fff !important;
}
.lc-btn:hover > span,
.lc-btn:focus-visible > span{color:#fff !important}

.lc-btn::before,.lc-btn::after,
.shiny-cta::before,.shiny-cta::after{
  content:"";
  pointer-events:none;
  position:absolute;
  left:50%;top:50%;
  translate:-50% -50%;
  z-index:-1;
}

.lc-btn:active,.shiny-cta:active{translate:0 1px}

/* dotted pattern */
.lc-btn::before,
.shiny-cta::before{
  --size:calc(100% - var(--shadow-size) * 3);
  --position:2px;
  --space:calc(var(--position) * 2);
  width:var(--size);
  height:var(--size);
  transform:none !important;
  background:radial-gradient(
    circle at var(--position) var(--position),
    white calc(var(--position) / 4),
    transparent 0
  ) padding-box !important;
  background-size:var(--space) var(--space) !important;
  background-repeat:space !important;
  mask-image:conic-gradient(
    from calc(var(--gradient-angle) + 45deg),
    black,
    transparent 10% 90%,
    black
  );
  border-radius:inherit;
  opacity:.4;
  animation:
    var(--animation) var(--duration),
    var(--animation) calc(var(--duration) / .4) reverse paused !important;
  animation-composition:add;
}
.lc-btn:hover::before{transform:none !important}

/* inner shimmer — removed (looked buggy on wide pill buttons) */
.lc-btn::after,
.shiny-cta::after{
  display:none !important;
}

.lc-btn:is(:hover,:focus-visible),
.shiny-cta:is(:hover,:focus-visible){
  --gradient-percent:20%;
  --gradient-angle-offset:95deg;
  --gradient-shine:var(--shiny-cta-highlight-subtle);
}
.lc-btn:is(:hover,:focus-visible),
.lc-btn:is(:hover,:focus-visible)::before,
.lc-btn:is(:hover,:focus-visible)::after,
.shiny-cta:is(:hover,:focus-visible),
.shiny-cta:is(:hover,:focus-visible)::before,
.shiny-cta:is(:hover,:focus-visible)::after{
  animation-play-state:running !important;
}

@keyframes gradient-angle{to{--gradient-angle:360deg}}
@keyframes shimmer{to{rotate:360deg}}

/* Header "Agendar" + WhatsApp buttons: black + green */
.lc-btn-green{
  --shiny-cta-highlight:#22c55e !important;
  --shiny-cta-highlight-subtle:#86efac !important;
}
