/* ─── premium share bar – scoped to .post-sharing-bottom ─────────────── */

.post-sharing-bottom .share-elements{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:.9rem;
}

/* generic chip ------------------------------------------------------- */
.post-sharing-bottom .share-elements .icon-wrapper{
    --bg:#333;                          /* fallback if class missing       */
    display:inline-flex;
    align-items:center;
    padding:1rem 2.2rem;                /* room for 3 rem glyph            */
    border-radius:10px;
    font:600 1.125rem/1.25 Inter,Roboto,sans-serif;   /* ≈18 px            */
    color:#fff;
    text-decoration:none;
    cursor:pointer;
    background:var(--bg);
    transition:transform .15s ease,
               box-shadow .15s ease,
               background .25s ease;
}

.post-sharing-bottom .share-elements .icon-wrapper .icon{
    display:inline-flex;
    margin-right:.8rem;
}

.post-sharing-bottom .share-elements .icon-wrapper img{
    width:3rem;            /* 48 px glyph as requested */
    height:3rem;
    fill:currentColor;     /* turns white automatically */
}

/* brand colours ------------------------------------------------------ */
.post-sharing-bottom .share-elements .icon-wrapper.icon-facebook {--bg:#0866ff;}   /* Meta Blue 2023 */
.post-sharing-bottom .share-elements .icon-wrapper.icon-twitter  {--bg:#000000;}   /* X black */
.post-sharing-bottom .share-elements .icon-wrapper.icon-pinterest{--bg:#e60023;}   /* Pinterest Red */

/* hover / focus effect ---------------------------------------------- */
.post-sharing-bottom .share-elements .icon-wrapper:hover,
.post-sharing-bottom .share-elements .icon-wrapper:focus{
    transform:translateY(-2px);
    box-shadow:0 5px 14px rgba(0,0,0,.22);
}

/* optional: reduce padding on small screens ------------------------- */
@media (max-width:480px){
    .post-sharing-bottom .share-elements .icon-wrapper{
        padding:.8rem 1.6rem;
        font-size:1rem;                  /* 16 px on very narrow screens */
    }
    .post-sharing-bottom .share-elements .icon-wrapper .icon{
        margin-right:.6rem;
    }
    .post-sharing-bottom .share-elements .icon-wrapper img{
        width:2.4rem;
        height:2.4rem;
    }
}
