@use '../../styles/variables';

.thy-result {
    display: block;
    text-align: center;
    padding: variables.$result-padding;
    &-title {
        font-size: variables.$result-title-font-size;
        margin-top: variables.$result-title-margin-top;
    }
    &-subtitle {
        color: variables.$result-subtitle-color;
        font-size: variables.$result-subtitle-font-size;
        margin-top: variables.$result-subtitle-margin-top;
    }
    &-extra {
        margin-top: variables.$result-extra-margin-top;
        & > *:not(:last-child) {
            margin-right: 8px;
        }
    }
}

.thy-result-svg-success,
.thy-result-svg-error,
.thy-result-svg-warning {
    display: inline-block;
}
.thy-result-svg-success-dark,
.thy-result-svg-error-dark,
.thy-result-svg-warning-dark {
    display: none;
}

:root[theme='dark'] {
    .thy-result-svg-success,
    .thy-result-svg-error,
    .thy-result-svg-warning {
        display: none;
    }
    .thy-result-svg-success-dark,
    .thy-result-svg-error-dark,
    .thy-result-svg-warning-dark {
        display: inline-block;
    }
}
