
.social-share {
    --font-size: var(--root-font-size); /* Reset, use REM */
    --color-border: var(--root-color-border);
    --has-border: 1;
    --width-border: var(--root-border-width);
}

.social-share__header {
    --color-text: var(--root-color-text);
    --font-size: 1rem;
}

.social-share__item {
    --color-background: transparent;
    --color-border: transparent;
    --color-icon: var(--root-color--primary);
    --has-border: 0;
    --shape-round: 0; /* 1 = round, 0 = square */
    --width-border: var(--root-border-width);
}

.social-share__item:focus,
.social-share__item:hover {
    --color-background: #e8f1f1;
    --color-border: transparent;
    --color-icon: var(--root-color--primary);
}

.social-share__container {
    border-top-style: solid;
}

.social-share__header {
    margin-top: 1rem;
}

.social-share__list {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    padding: 0;
}

.social-share__item {
    border-style: solid;
}

.social-share__link {
    align-items: center;
    display: flex;
    height: 2.222em;
    justify-content: center;
    width: 2.222em;
}

.social-share__link__icon {
    width: 50%;
}

.social-share {
    font-size: var(--font-size, 1rem); /* Reset, use REM */
    margin-top: calc(calc(var(--has-border, 1) * 1rem) + 2rem);
}

.social-share__container {
    border-top-color: var(--color-border, transparent);
    border-top-width: calc(var(--has-border, 1) * var(--width-border, 0.063em));
}

.social-share__item {
    background-color: var(--color-background, transparent);
    border-color: var(--color-border, black);
    border-radius: calc(var(--has-border, 1) * var(--shape-round, 1) * 50%);
    border-width: calc(var(--has-border, 1) * var(--width-border, 0.063em));
}

.social-share__link__icon {
    fill: var(--color-icon, black);
}
