.uzel-toc {
    box-sizing: border-box;
    width: 100%;
    font-family: var(--uzel-toc-font, inherit);
    background: var(--uzel-toc-bg, #fff);
    border-radius: var(--uzel-toc-radius, 28px);
    padding: var(--uzel-toc-py, 26px) var(--uzel-toc-px, 28px);
    box-shadow: var(--uzel-toc-shadow, 0 16px 42px rgba(15, 15, 15, 0.08));
}

.uzel-toc,
.uzel-toc * {
    box-sizing: border-box;
}

.uzel-toc.is-empty {
    display: none !important;
}

.uzel-toc__title {
    margin: 0 0 16px 0;
    color: var(--uzel-toc-title-color, #5d5d5d);
    font-size: var(--uzel-toc-title-size, 26px);
    line-height: 1.15;
    font-weight: var(--uzel-toc-title-weight, 700);
    letter-spacing: -0.02em;
}

.uzel-toc__list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--uzel-toc-item-gap, 16px);
    margin: 0;
    padding: 0;
}

.uzel-toc__item {
    display: block;
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 0 0 0 calc(var(--uzel-toc-line-width, 2px) + var(--uzel-toc-active-indent, 14px));
    color: var(--uzel-toc-item-color, #5d5d5d) !important;
    text-decoration: none !important;
    font-size: var(--uzel-toc-item-size, 17px);
    line-height: 1.28;
    font-weight: var(--uzel-toc-item-weight, 600);
    transition: color .22s ease, transform .22s ease;
}

.uzel-toc__item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.05em;
    bottom: 0.05em;
    width: var(--uzel-toc-line-width, 2px);
    min-width: var(--uzel-toc-line-width, 2px);
    border-radius: 99px;
    background: transparent;
    transition: background .22s ease;
}

.uzel-toc__item:hover,
.uzel-toc__item:focus,
.uzel-toc__item:active {
    color: var(--uzel-toc-item-hover-color, #0095ff) !important;
    text-decoration: none !important;
    outline: none;
}

.uzel-toc__item.is-active {
    color: var(--uzel-toc-item-active-color, #0095ff) !important;
}

.uzel-toc__item.is-active::before {
    background: var(--uzel-toc-line-color, #0095ff);
}

.uzel-toc-target {
    scroll-margin-top: 120px;
}

@media (max-width: 767px) {
    .uzel-toc {
        padding: var(--uzel-toc-mobile-py, 22px) var(--uzel-toc-mobile-px, 20px);
    }

    .uzel-toc__title {
        font-size: var(--uzel-toc-mobile-title-size, 22px);
        margin-bottom: 14px;
    }

    .uzel-toc__item {
        font-size: var(--uzel-toc-mobile-item-size, 16px);
    }
}
