.browser-preview {
    height: 720px;
    border: $default-border;
    border-radius: $big-border-radius;
    box-shadow: 0 4px 16px 0 rgba(#e5e8e8, 0.75);

    &__header {
        color: var(--white);
        font-size: 15px;
        background-color: var(--navy-blue-60);
        border-radius: $big-border-radius $big-border-radius 0 0;

        .white-dot {
            display: inline-block;
            width: 10px;
            height: 10px;
            margin-left: 5px;
            background-color: var(--white);
            border-radius: 50%;
        }
    }

    &__content {
        overflow: auto;
    }

    &__state {
        color: var(--title-text-color);

        svg,
        img {
            width: 220px;
            height: 220px;
        }

        .medium-title-text {
            line-height: 24px;
        }

        &--error {
            color: var(--default-text-color);
            font-size: var(--default-font-size);
            line-height: 18px;
        }
    }
}