/* FACELOV FRIEND BIRTHDAYS V1.0.0 */

.fl-v220-side-card[data-birthday-card][hidden]{
  display:none!important;
}

.fl-bday-side-row{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:4px 0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}

.fl-bday-side-avatars{
  width:54px;
  min-width:54px;
  display:flex;
  align-items:center;
}

.fl-bday-side-avatar{
  position:relative;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  overflow:visible;
  border:2px solid #fff;
  border-radius:50%;
  background:linear-gradient(135deg,#7b3bf0,#df2fbf);
  color:#fff;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
}

.fl-bday-side-avatar.is-second{
  margin-left:-17px;
}

.fl-bday-side-avatar img,
.fl-bday-side-avatar>span{
  width:100%;
  height:100%;
  border-radius:50%;
}

.fl-bday-side-avatar img{
  object-fit:cover;
}

.fl-bday-side-avatar>span{
  display:grid;
  place-items:center;
}

.fl-bday-side-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.fl-bday-side-copy strong{
  color:#293145;
  font-size:11px;
  line-height:1.3;
}

.fl-bday-side-copy small{
  color:#8b94a4;
  font-size:9px;
  line-height:1.35;
}

.fl-bday-modal,
.fl-bday-gift-modal{
  position:fixed;
  inset:0;
  z-index:2147482500;
  display:grid;
  place-items:center;
  padding:18px;
}

.fl-bday-modal[hidden],
.fl-bday-gift-modal[hidden]{
  display:none!important;
}

.fl-bday-modal__backdrop,
.fl-bday-gift-modal__backdrop{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  background:rgba(21,25,37,.46);
  cursor:default;
}

.fl-bday-modal__panel,
.fl-bday-gift-modal__panel{
  position:relative;
  z-index:1;
  width:min(620px,100%);
  max-height:min(760px,calc(100vh - 36px));
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid #e6e8ef;
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 70px rgba(21,25,37,.24);
}

.fl-bday-gift-modal__panel{
  width:min(500px,100%);
}

.fl-bday-modal__head,
.fl-bday-gift-modal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:17px 18px;
  border-bottom:1px solid #eceef3;
}

.fl-bday-modal__head>div,
.fl-bday-gift-modal__head>div{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.fl-bday-modal__head strong,
.fl-bday-gift-modal__head strong{
  color:#20283a;
  font-size:19px;
  font-weight:800;
}

.fl-bday-modal__head small,
.fl-bday-gift-modal__head small{
  color:#8a93a3;
  font-size:10px;
}

.fl-bday-modal__close,
.fl-bday-gift-modal__close{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:#f0f1f5;
  color:#646d7d;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}

.fl-bday-modal__body{
  overflow:auto;
  padding:16px;
}

.fl-bday-group+ .fl-bday-group{
  margin-top:20px;
}

.fl-bday-group h3{
  margin:0 0 9px;
  color:#6f36dc;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.fl-bday-list{
  display:grid;
  gap:9px;
}

.fl-bday-person{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:11px;
  border:1px solid #eceef3;
  border-radius:13px;
  background:#fff;
}

.fl-bday-person__avatar{
  position:relative;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  overflow:visible;
  border-radius:50%;
  background:linear-gradient(135deg,#7a3cf0,#d92ec1);
  color:#fff;
  text-decoration:none;
}

.fl-bday-person__avatar img,
.fl-bday-person__avatar>span{
  width:100%;
  height:100%;
  border-radius:50%;
}

.fl-bday-person__avatar img{
  object-fit:cover;
}

.fl-bday-person__avatar>span{
  display:grid;
  place-items:center;
  font-weight:800;
}

.fl-bday-online{
  position:absolute;
  right:0;
  bottom:1px;
  width:12px;
  height:12px;
  border:2px solid #fff;
  border-radius:50%;
  background:#20af59;
}

.fl-bday-person__copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.fl-bday-person__name{
  overflow:hidden;
  color:#222a3b;
  font-size:13px;
  font-weight:800;
  text-decoration:none;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.fl-bday-person__name:hover{
  text-decoration:underline;
}

.fl-bday-person__copy small{
  color:#8b94a5;
  font-size:10px;
}

.fl-bday-person__actions{
  display:flex;
  align-items:center;
  gap:6px;
}

.fl-bday-action{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  border:0;
  border-radius:8px;
  background:#eceef3;
  color:#343c4d;
  font:inherit;
  font-size:10px;
  font-weight:750;
  text-decoration:none;
  cursor:pointer;
}

.fl-bday-action--message{
  color:#fff;
  background:linear-gradient(135deg,#7139f1,#a735e5);
}

.fl-bday-action--gift{
  color:#a65b00;
  background:#fff0dc;
}

.fl-bday-empty,
.fl-bday-loading{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:24px;
  color:#828b9b;
  text-align:center;
  font-size:11px;
}

.fl-bday-empty>span{
  font-size:34px;
}

.fl-bday-empty strong{
  color:#30384a;
  font-size:14px;
}

.fl-bday-gift-recipient{
  padding:14px 18px 0;
  color:#4b5568;
  font-size:11px;
  font-weight:700;
}

.fl-bday-gift-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  padding:14px 18px;
  max-height:360px;
  overflow:auto;
}

.fl-bday-gift-choice{
  min-height:106px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px;
  border:1px solid #e6e8ef;
  border-radius:12px;
  background:#fff;
  color:#333b4c;
  font:inherit;
  cursor:pointer;
}

.fl-bday-gift-choice.is-selected{
  border-color:#853bea;
  box-shadow:0 0 0 2px rgba(133,59,234,.13);
  background:#fbf8ff;
}

.fl-bday-gift-choice__emoji{
  font-size:28px;
}

.fl-bday-gift-choice strong{
  font-size:11px;
}

.fl-bday-gift-choice small{
  color:#8c95a4;
  font-size:9px;
}

.fl-bday-gift-send{
  margin:0 18px 18px;
  min-height:40px;
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,#7339f2,#d12fc8);
  color:#fff;
  font:inherit;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}

.fl-bday-gift-send:disabled{
  opacity:.5;
  cursor:default;
}

.fl-bday-gift-empty{
  grid-column:1/-1;
  padding:24px;
  color:#8b94a4;
  text-align:center;
  font-size:11px;
}

.fl-bday-toast{
  position:fixed;
  left:50%;
  bottom:26px;
  z-index:2147483000;
  max-width:min(440px,calc(100vw - 24px));
  padding:11px 16px;
  border-radius:10px;
  background:#252b38;
  color:#fff;
  box-shadow:0 8px 30px rgba(0,0,0,.2);
  font-size:11px;
  font-weight:700;
  opacity:0;
  transform:translate(-50%,10px);
  transition:opacity .18s ease,transform .18s ease;
}

.fl-bday-toast.is-visible{
  opacity:1;
  transform:translate(-50%,0);
}

.fl-bday-toast.is-success{
  background:#168a4a;
}

html.fl-bday-open{
  overflow:hidden;
}

@media(max-width:700px){
  .fl-bday-person{
    grid-template-columns:auto minmax(0,1fr);
  }

  .fl-bday-person__actions{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
  }

  .fl-bday-gift-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}