/**
 * Save button + favorites filter (paired with sync-broker-favorites.js). The
 * Save button matches the single Share button's outline pill. `button.sb-save`
 * (0,2,1 with a state) outranks theme [type=button]:hover / button:hover; the
 * widget's {{WRAPPER}} controls out-specify these defaults.
 */
button.sb-save,
button.sb-save:hover,
button.sb-save:focus,
button.sb-save:active {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 14px;
    border: 1px solid #ddd8c4;
    border-radius: 999px;
    background: #fff;
    color: inherit;
    font: inherit;
    font-size: 14px;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    box-shadow: none;
}

button.sb-save:hover {
    background: #f5f5f0;
}

button.sb-save:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.sb-save__icon {
    display: inline-flex;
}

.sb-save__icon svg {
    width: 1em;
    height: 1em;
}

.sb-save__icon--on,
button.sb-save[aria-pressed="true"] .sb-save__icon--off {
    display: none;
}

button.sb-save[aria-pressed="true"] .sb-save__icon--on {
    display: inline-flex;
    color: var(--sb-primary-color, #e37a47);
}

.sb-fav-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid #ddd8c4;
    border-radius: 999px;
    background: #fff;
    font-size: 14px;
    line-height: 1.2;
    cursor: pointer;
}

.sb-fav-filter input {
    margin: 0;
}

.sb-fav-filter__icon {
    color: var(--sb-primary-color, #e37a47);
}

.sb-fav-filter__count {
    opacity: 0.7;
}