#component-calendar{
  margin:0;
  font-family:'Poppins',sans-serif;
  background:linear-gradient(180deg,#f5f7fb,#eef2f7);
  display:flex;
  justify-content:center;
  padding:2rem 1rem;
  color:#1b1b1b;
}
#component-calendar .wrap{
  width:100%;
  max-width:1000px;
}
#component-calendar .toggle-wrapper{
  display:flex;
  justify-content:center;
  margin-bottom:1.6rem;
}
#component-calendar .toggle{
  position:relative;
  display:flex;
  width:100%;
  max-width:420px;
  border-radius:999px;
  padding:6px;

  background:#e9edf3;
  box-shadow:
    inset 0 4px 12px rgba(0,0,0,0.08),
    inset 0 -2px 6px rgba(255,255,255,0.6);
}
#component-calendar .toggle-pill{
  position:absolute;
  top:6px;
  left:6px;
  height:calc(100% - 12px);
  width:calc(50% - 6px);
  border-radius:999px;

  background:linear-gradient(135deg,#79A6DA,#003F87);

  box-shadow:
    0 8px 18px rgba(0,63,135,0.25),
    inset 0 2px 4px rgba(255,255,255,0.35),
    inset 0 -2px 4px rgba(0,0,0,0.15);

  will-change:transform;
}
#component-calendar .toggle-btn{
  flex:1;
  border:none;
  background:none;
  padding:14px 10px;
  border-radius:999px;
  cursor:pointer;
  font-weight:700;
  color:#6b778c;
  z-index:2;
}
#component-calendar .toggle-btn.active{
  color:#fff;
}
#component-calendar .embed-wrap{
  position:relative;
  border-radius:28px;
  overflow:hidden;
  background:#ffffff;
  border:1px solid rgba(0,0,0,0.06);
  box-shadow:0 18px 40px rgba(0,0,0,0.08);
  transform-origin:center;

  transition:
    transform .25s ease,
    filter .25s ease,
    opacity .2s ease;
}
#component-calendar .embed-wrap.animating{
  transform:scale(0.985);
  filter:blur(1px);
  opacity:0.85;
}
#component-calendar .embed-wrap.calendar-rebound{
  animation:calendar-rebound .35s cubic-bezier(.25,1.4,.5,1);
}
@keyframes calendar-rebound{
  0%{transform:scale(0.985);}
  60%{transform:scale(1.01);}
  100%{transform:scale(1);}
}
#component-calendar iframe{
  width:100%;
  height:720px;
  border:0;
}
@media(max-width:640px){#component-calendar iframe{height:600px;}}