Modèle:SocialButton/styles.css

/* ===============================
   Bandeau
   =============================== */

.sb-footer{
  display:flex;
  align-items:center;
  gap:16px;
  padding:14px 16px;
  width:100%;
  box-sizing:border-box;
  background:transparent;
}


/* ===============================
   Titres
   =============================== */

.sb-title{
  font-weight:700;
  font-size:1.05rem;
  white-space:nowrap;
  color:#000;
}

.sb-spacer{
  flex:1;
}


/* ===============================
   Groupes
   =============================== */

.sb-buttons{
  display:flex;
  align-items:center;
  gap:10px;
}


/* ===============================
   Boutons (style ButtonLink-like)
   =============================== */

.sb-btn{
  border-radius:12px;
  overflow:hidden;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  box-shadow:0 2px 8px rgba(0,0,0,.10);
  transition:.2s;
}

.sb-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 4px 16px rgba(0,0,0,.20);
}


/* tailles */
.sb-icon{
  width:58px;
  height:58px;
}

.sb-support{
  height:58px;
  padding:0 14px;
  gap:10px;
}


/* lien MW */
.sb-footer a{
  display:flex;
  align-items:center;
  gap:10px;

  text-decoration:none !important;
  color:#fff !important;
}

/* supprimer icône externe */
.sb-footer a.external::after{
  display:none !important;
}


/* images */
.sb-icon img{
  width:28px !important;
  height:28px !important;
}

.sb-support img{
  width:22px !important;
  height:22px !important;
}


/* ===============================
   Responsive
   =============================== */

@media (max-width:900px){
  .sb-footer{
    flex-wrap:wrap;
  }
}