@import "../../css/colors.css";

@keyframes iconSpin {
    0% {
        rotate: 0deg;
    }
    50% {
        rotate: 180deg;
    }
    100% {
        rotate: 360deg;
    }
}

.share-button {
    background: $motion-primary;
    color: $ui-white;
    box-shadow: 0 0 0 1px $ui-black-transparent;
    visibility: collapse;
}

.disabled {
    cursor: not-allowed;
}

.share-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

[theme="dark"] .share-button {
    background: transparent;
    color: $ui-white;
    box-shadow: 0 0 0 1px $ui-black-transparent;
}

.share-button-is-shared {
    background: $ui-black-transparent;
    cursor: default;
}

.icon {
    height: 1.5rem;
    margin-left: 4px;
    animation-name: iconSpin;
    animation-timing-function: linear;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}