<script setup lang="ts">
/**
 * ErrorBrand — фирменный блок «Лидерра.» в шапке ErrorView.
 * Sprint 4 Phase B/3 — split ErrorView (audit O-refactor-04 закрытие).
 *
 * Класс `.top-brand` сохранён — Vitest тест selector'ом `.top-brand` рассчитывает на
 * корневой элемент сабкомпонента.
 */
</script>

<template>
    <a class="top-brand" href="/" aria-label="На главную">
        <span class="mark" aria-hidden="true">
            <svg viewBox="0 0 48 48" width="22" height="22">
                <path
                    d="M16 14 L16 34 L32 34"
                    stroke="#fff"
                    stroke-width="4.5"
                    stroke-linecap="round"
                    stroke-linejoin="round"
                    fill="none"
                />
                <circle cx="32" cy="34" r="3.5" fill="#0F6E56" />
            </svg>
        </span>
        <span class="brand-text">Лидерра<span class="dot">.</span></span>
    </a>
</template>

<style scoped>
.top-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    text-decoration: none;
    padding: 24px 32px;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.01em;
}
.top-brand .mark {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.06);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.top-brand .dot {
    color: #32c8a9;
}
</style>
