/* Стилі для пагінації наборів даних (еталон) */

/* Контейнер пагінації */
.ua-dataset-pagination {
    width: 100%;
    max-width: 1200px;
    margin: 40px auto;
}

/* Контейнер пагінації */
.ua-dataset-pagination .ua-pagination-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0 20px;
}

/* Обгортка для номерів сторінок (центральна група) */
.ua-dataset-pagination .ua-pagination-pages-wrapper {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
}

/* Елемент пагінації (li) */
.ua-dataset-pagination .ua-pagination-item {
    display: inline-flex;
    margin: 0;
    padding: 0;
}

/* Номери сторінок - круглі кнопки з рамкою */
.ua-dataset-pagination .ua-pagination-item--number {
    width: 48px;
    height: 48px;
    border: 2px solid var(--border-color-defoult, #E2E8F0);
    border-radius: 50%;
}

/* Активна сторінка - чорне коло */
.ua-dataset-pagination .ua-pagination-item--number.is-active {
    background: var(--text-primary, #1E293B);
    border-color: var(--text-primary, #1E293B);
}

/* Посилання та span всередині */
.ua-dataset-pagination .ua-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: Daikon, sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    color: var(--text-primary, #1E293B);
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
}

/* Для номерів сторінок - заповнити всю площу кола */
.ua-dataset-pagination .ua-pagination-item--number .ua-pagination-link {
    width: 100%;
    height: 100%;
}

/* Активна сторінка - білий текст */
.ua-dataset-pagination .ua-pagination-item--number.is-active .ua-pagination-link {
    color: #fff;
    cursor: default;
    pointer-events: none;
}

/* Навігаційні кнопки (Попередня/Наступна) */
.ua-dataset-pagination .ua-pagination-link--nav {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    margin: 0 16px;
    height: auto;
    min-width: 180px;
    white-space: nowrap;
    font-weight: 400;
    color: var(--text-secondary, #475569);
    outline: none;
    border: none;
}

.ua-dataset-pagination .ua-pagination-link--nav svg {
    flex-shrink: 0;
}

/* Вимкнені навігаційні кнопки */
.ua-dataset-pagination .ua-pagination-link--nav.ua-pagination-link--disabled {
    color: var(--text-disabled, #CBD5E1);
    cursor: default;
    pointer-events: none;
}

/* Кнопки prev/next займають простір по краях */
.ua-dataset-pagination .ua-pagination-item--prev,
.ua-dataset-pagination .ua-pagination-item--next {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Ellipsis (три крапки) */
.ua-dataset-pagination .ua-pagination-item--ellipsis {
    border: none;
}

.ua-dataset-pagination .ua-pagination-item--ellipsis .ua-pagination-link {
    cursor: default;
    width: auto;
    height: auto;
    padding: 0 12px;
    pointer-events: none;
    color: var(--text-secondary, #475569);
    font-size: 24px;
    font-weight: 700;
}

/* Hover ефекти */
.ua-dataset-pagination .ua-pagination-item--number:hover:not(.is-active) {
    border-color: var(--bg-accent, #0350A5);
}

.ua-dataset-pagination .ua-pagination-item--number:hover:not(.is-active) .ua-pagination-link {
    color: var(--bg-accent, #0350A5);
}

.ua-dataset-pagination .ua-pagination-link--nav:hover:not(.ua-pagination-link--disabled) {
    color: var(--bg-accent, #0350A5);
}

.ua-dataset-pagination .ua-pagination-link--nav:focus {
    outline: none;
    border: none;
}

/* Скидання стилів для відвіданих посилань */
.ua-dataset-pagination a.ua-pagination-link:visited,
.ua-dataset-pagination a.ua-pagination-link:link {
    color: inherit;
}

/* Прибираємо контур для всіх посилань при фокусі та наведенні */
.ua-dataset-pagination a:focus,
.ua-dataset-pagination a:focus-visible,
.ua-dataset-pagination a:hover,
.ua-dataset-pagination a:active,
.ua-dataset-pagination a.ua-pagination-link:focus,
.ua-dataset-pagination a.ua-pagination-link:focus-visible,
.ua-dataset-pagination a.ua-pagination-link:hover,
.ua-dataset-pagination a.ua-pagination-link:active {
    outline: none !important;
    outline-width: 0 !important;
    outline-style: none !important;
    outline-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Прибираємо контур для контейнерів навігаційних кнопок */
.ua-dataset-pagination .ua-pagination-item--prev,
.ua-dataset-pagination .ua-pagination-item--next,
.ua-dataset-pagination .ua-pagination-item--prev *,
.ua-dataset-pagination .ua-pagination-item--next * {
    outline: none !important;
    outline-width: 0 !important;
    outline-style: none !important;
    outline-color: transparent !important;
}

/* Прибираємо border для навігаційних посилань */
.ua-dataset-pagination .ua-pagination-item--prev a,
.ua-dataset-pagination .ua-pagination-item--next a,
.ua-dataset-pagination .ua-pagination-item--prev span,
.ua-dataset-pagination .ua-pagination-item--next span {
    border: none !important;
    box-shadow: none !important;
}

/* Специфічно для навігаційних кнопок при всіх станах */
.ua-dataset-pagination .ua-pagination-link--nav:focus,
.ua-dataset-pagination .ua-pagination-link--nav:focus-visible,
.ua-dataset-pagination .ua-pagination-link--nav:hover,
.ua-dataset-pagination .ua-pagination-link--nav:active {
    outline: none !important;
    outline-width: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Максимально агресивне прибирання контурів - для browser defaults */
.ua-dataset-pagination *:focus,
.ua-dataset-pagination *:focus-visible {
    outline: 0 !important;
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}

/* Специфічно для Chrome/Safari webkit focus ring */
.ua-dataset-pagination *::-moz-focus-inner {
    border: 0 !important;
}

.ua-dataset-pagination a::-moz-focus-inner,
.ua-dataset-pagination button::-moz-focus-inner {
    border: 0 !important;
}
