/* Shared property picker pagination (Imóveis, Contabilidade, Procurement). */

.re-accounting-page [data-cell-id="pickPagerPane"] > .dhx_layout-cell-content,
.re-property-mnt-page [data-cell-id="pickPagerPane"] > .dhx_layout-cell-content {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 48px;
    padding: 8px 12px;
    box-sizing: border-box;
    overflow: visible;
}

/* Let the pagination card provide its own surface; avoid a double frame on the shell row. */
.re-accounting-page:not(.re-property-picker-page--empty) [data-cell-id="pickPagerPane"],
.re-property-mnt-page:not(.re-property-picker-page--empty) [data-cell-id="pickPagerPane"] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.re-property-picker-pagination {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    overflow: visible;
    box-sizing: border-box;
}

.re-property-picker-pagination .dhx_toolbar {
    width: 100%;
    min-height: 52px;
    background: var(--re-surface) !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
    overflow: visible;
}

[data-theme="dark"] .re-property-picker-pagination .dhx_toolbar {
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
}

/* DHTMLX toolbar: nav > ul.dhx_navbar > li — keep default order, center the whole bar. */
.re-property-picker-pagination .dhx_navbar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap;
    gap: 6px !important;
    width: 100%;
    padding: 8px 14px !important;
    background: transparent !important;
}

.re-property-picker-pagination .dhx_navbar > li:has([data-dhx-id="count"]) {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Nav buttons — data-dhx-id is on the button element itself. */
.re-property-picker-pagination button.dhx_button[data-dhx-id="first"],
.re-property-picker-pagination button.dhx_button[data-dhx-id="previous"],
.re-property-picker-pagination button.dhx_button[data-dhx-id="next"],
.re-property-picker-pagination button.dhx_button[data-dhx-id="last"] {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid var(--re-border) !important;
    background: var(--re-surface) !important;
    color: var(--re-ink) !important;
    box-shadow: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.re-property-picker-pagination button.dhx_button[data-dhx-id="first"]:hover:not(:disabled),
.re-property-picker-pagination button.dhx_button[data-dhx-id="previous"]:hover:not(:disabled),
.re-property-picker-pagination button.dhx_button[data-dhx-id="next"]:hover:not(:disabled),
.re-property-picker-pagination button.dhx_button[data-dhx-id="last"]:hover:not(:disabled) {
    background: var(--re-surface-soft) !important;
    border-color: var(--re-border-strong) !important;
}

.re-property-picker-pagination button.dhx_button[data-dhx-id="first"] .dhx_button__icon,
.re-property-picker-pagination button.dhx_button[data-dhx-id="previous"] .dhx_button__icon,
.re-property-picker-pagination button.dhx_button[data-dhx-id="next"] .dhx_button__icon,
.re-property-picker-pagination button.dhx_button[data-dhx-id="last"] .dhx_button__icon {
    color: var(--re-ink) !important;
    font-size: 16px !important;
}

.re-property-picker-pagination button.dhx_button[data-dhx-id="first"]:disabled,
.re-property-picker-pagination button.dhx_button[data-dhx-id="previous"]:disabled,
.re-property-picker-pagination button.dhx_button[data-dhx-id="next"]:disabled,
.re-property-picker-pagination button.dhx_button[data-dhx-id="last"]:disabled {
    opacity: 0.38;
    pointer-events: none;
}

/* Current page input — shown beside "de N" (e.g. "1 de 2"). */
.re-property-picker-pagination input.dhx_input[data-dhx-id="count"],
.re-property-picker-pagination [data-dhx-id="count"] .dhx_input,
.re-property-picker-pagination .dhx_pagination__count-panel .dhx_input {
    width: 40px !important;
    min-width: 40px !important;
    height: 32px !important;
    padding: 0 10px !important;
    text-align: center;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    border: 1px solid var(--re-primary) !important;
    background: var(--re-primary) !important;
    color: var(--re-primary-on) !important;
    box-shadow: none !important;
}

.re-property-picker-pagination input.dhx_input[data-dhx-id="count"]:hover,
.re-property-picker-pagination [data-dhx-id="count"] .dhx_input:hover,
.re-property-picker-pagination .dhx_pagination__count-panel .dhx_input:hover {
    background: var(--re-primary-hover) !important;
    border-color: var(--re-primary-hover) !important;
}

.re-property-picker-pagination input.dhx_input[data-dhx-id="count"]:focus,
.re-property-picker-pagination [data-dhx-id="count"] .dhx_input:focus,
.re-property-picker-pagination [data-dhx-id="count"] .dhx_input--focus,
.re-property-picker-pagination .dhx_pagination__count-panel .dhx_input:focus,
.re-property-picker-pagination .dhx_pagination__count-panel .dhx_input--focus {
    background: var(--re-primary) !important;
    border-color: var(--re-primary) !important;
    color: var(--re-primary-on) !important;
    box-shadow: 0 0 0 3px var(--re-primary-softer) !important;
}

/* Total pages — label text is set to "de N" in workspaceShellMnt.js. */
.re-property-picker-pagination span.dhx_navbar-title[data-dhx-id="size"],
.re-property-picker-pagination [data-dhx-id="size"].dhx_navbar-title {
    color: var(--re-ink-muted) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
    padding: 0 2px;
    background: transparent !important;
    border: none !important;
}

.re-accounting-page [data-cell-id="pickPagerPane"] .dhx_pagination,
.re-property-mnt-page [data-cell-id="pickPagerPane"] .dhx_pagination {
    width: 100%;
    overflow: visible;
}

.re-accounting-page [data-cell-id="pickPagerPane"] .dhx_pagination .dhx_toolbar,
.re-property-mnt-page [data-cell-id="pickPagerPane"] .dhx_pagination .dhx_toolbar {
    width: 100%;
    overflow: visible;
}