/* Base */
.osb-desktop-bar,
.osb-mobile { font-family: inherit; }
.osb-button {
    --osb-brand: #444;
    box-sizing: border-box;
    border: 0;
    text-decoration: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--osb-brand);
    background: #fff;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.osb-button:hover { transform: translateY(-1px); box-shadow: 0 3px 12px rgba(0,0,0,.14); }
.osb-icon { display:flex; align-items:center; justify-content:center; }
.osb-icon svg { width: 1em; height: 1em; display:block; }
.osb-label { line-height:1; }

/* Desktop: small square buttons stacked vertically */
.osb-desktop-bar {
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 6px 5px 6px 0;
}
.osb-desktop-bar .osb-button {
    width: 38px;
    height: 38px;
    border-radius: 0 5px 5px 0;
    color: var(--osb-brand);
    box-shadow: 0 1px 6px rgba(0,0,0,.10);
}
.osb-desktop-bar .osb-button:hover { color:#fff; background:var(--osb-brand); }
.osb-desktop-bar .osb-share { color:#fff; background:var(--osb-brand); }

/* Mobile: rectangular buttons after post */
.osb-mobile {
    display: none;
    margin: 28px 0 8px;
    gap: 8px;
    flex-wrap: wrap;
}
.osb-mobile .osb-button {
    min-height: 42px;
    padding: 0 13px;
    gap: 9px;
    border-radius: 5px;
    color: #fff;
    background: var(--osb-brand);
    box-shadow: none;
}
.osb-mobile .osb-button:hover { color:#fff; background:var(--osb-brand); }
.osb-mobile .osb-icon { font-size: 20px; }
.osb-mobile .osb-share { background:var(--osb-brand); }

/* Keep admin/editor unaffected */
@media (max-width: 767px) {
    .osb-desktop-bar { display:none; }
    .osb-mobile { display:flex; }
}
@media (min-width: 768px) {
    .osb-mobile { display:none; }
}

/* CSS hooks */
.osb-desktop-bar {}
.osb-mobile {}
.osb-button {}
.osb-network {}
.osb-facebook {}
.osb-x {}
.osb-linkedin {}
.osb-whatsapp {}
.osb-telegram {}
.osb-email {}
.osb-copy {}
.osb-share {}
.osb-icon {}
.osb-label {}