/* Header "Baby care" button: gentle idle pulse, a light shine, and a wiggle on hover. */
.tb .bc-btn{position:relative;overflow:hidden;isolation:isolate;
  animation:bc-ring 3.2s ease-out 1s infinite}
.tb .bc-btn:before{content:"";position:absolute;top:-10%;left:-75%;width:45%;height:120%;z-index:-1;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.75) 50%,transparent 100%);
  transform:skewX(-20deg);animation:bc-shine 3.6s ease-in-out 1.5s infinite;pointer-events:none}
.tb .bc-btn:hover{transform:translateY(-2px) scale(1.05);border-color:var(--coral);
  animation:bc-ring 3.2s ease-out infinite,bc-wig .6s ease 1}
.tb .bc-btn:active{transform:scale(.95);transition:transform .08s}

@keyframes bc-ring{0%{box-shadow:0 0 0 0 rgba(242,107,91,.45)}70%,100%{box-shadow:0 0 0 10px rgba(242,107,91,0)}}
@keyframes bc-shine{0%{left:-75%}55%,100%{left:130%}}
@keyframes bc-wig{
  0%,100%{transform:translateY(-2px) scale(1.05) rotate(0)}
  20%{transform:translateY(-2px) scale(1.05) rotate(-5deg)}
  40%{transform:translateY(-2px) scale(1.05) rotate(5deg)}
  60%{transform:translateY(-2px) scale(1.05) rotate(-2deg)}
  80%{transform:translateY(-2px) scale(1.05) rotate(1deg)}}

html.calm .tb .bc-btn,html.calm .tb .bc-btn:before,html.calm .tb .bc-btn:hover{animation:none!important}
@media (prefers-reduced-motion:reduce){
  .tb .bc-btn,.tb .bc-btn:before,.tb .bc-btn:hover{animation:none!important}
}

/* Header "Mom care" button: rose tint, soft heartbeat glow, shine and a wiggle on hover. */
.tb .mc-btn{position:relative;overflow:hidden;isolation:isolate;background:#ffe9f0;border-color:#f4a9c0;color:#a8284f;
  animation:mc-ring 3.2s ease-out 1.8s infinite}
.tb .mc-btn:before{content:"";position:absolute;top:-10%;left:-75%;width:45%;height:120%;z-index:-1;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.8) 50%,transparent 100%);
  transform:skewX(-20deg);animation:bc-shine 3.6s ease-in-out 2.4s infinite;pointer-events:none}
.tb .mc-btn .mc-h{display:inline-block;margin-right:5px;animation:mc-beat 1.6s ease-in-out infinite}
.tb .mc-btn:hover{transform:translateY(-2px) scale(1.05);border-color:#e8527f;animation:mc-ring 3.2s ease-out infinite,bc-wig .6s ease 1}
.tb .mc-btn:active{transform:scale(.95);transition:transform .08s}
@keyframes mc-ring{0%{box-shadow:0 0 0 0 rgba(232,82,127,.45)}70%,100%{box-shadow:0 0 0 10px rgba(232,82,127,0)}}
@keyframes mc-beat{0%,100%{transform:scale(1)}15%{transform:scale(1.28)}30%{transform:scale(1)}45%{transform:scale(1.18)}60%{transform:scale(1)}}
html.calm .tb .mc-btn,html.calm .tb .mc-btn:before,html.calm .tb .mc-btn:hover,html.calm .tb .mc-btn .mc-h{animation:none!important}
@media (prefers-reduced-motion:reduce){.tb .mc-btn,.tb .mc-btn:before,.tb .mc-btn:hover,.tb .mc-btn .mc-h{animation:none!important}}
@media (max-width:560px){.tb .mc-btn .mc-h{display:none}}

/* Baby care button redesign: sky-blue tint, rocking bottle icon, matches the Mom care button. */
.tb .bc-btn{background:#e6f2ff;border-color:#9cc7f2;color:#1b5fa8;animation-name:bc-ring2}
.tb .bc-btn:hover{border-color:#3d8fe0;animation:bc-ring2 3.2s ease-out infinite,bc-wig .6s ease 1}
.tb .bc-btn .bc-i{display:inline-block;margin-right:5px;transform-origin:50% 90%;animation:bc-rock 2.4s ease-in-out infinite}
@keyframes bc-ring2{0%{box-shadow:0 0 0 0 rgba(61,143,224,.45)}70%,100%{box-shadow:0 0 0 10px rgba(61,143,224,0)}}
@keyframes bc-rock{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}
html.calm .tb .bc-btn .bc-i{animation:none!important}
@media (prefers-reduced-motion:reduce){.tb .bc-btn .bc-i{animation:none!important}}
@media (max-width:560px){.tb .bc-btn .bc-i{display:none}}
