/* Projects List Block */

/* Caption widoczny tylko dla czytników ekranu */
.projects-table caption.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Wiersz filtrów (td zamiast th – to nie są nagłówki) */
.projects-table thead tr.column-filters td {
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* DataTables pagination styling */

/* Wrapper */
.projects-list-section .dataTables_wrapper .dataTables_paginate {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.75rem; /* ~gap-7 */
    margin-top: 2.5rem; /* ~mt-10 */
}

.projects-list-section .dataTables_wrapper .dataTables_paginate > span {
    display: flex;
    align-items: center;
    gap: 1.75rem;
}

/* Page buttons */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button {
    min-width: 3rem; /* 48px */
    height: 3rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem; /* rounded-lg */
    border: 1px solid #e5e7eb; /* gray-300 */
    background: #ffffff !important;
    color: var(--clr-primary) !important;
    font-weight: 500;
    text-decoration: none;
    box-sizing: border-box;
    transition:
        border-color 0.2s ease-in-out,
        background-color 0.2s ease-in-out,
        color 0.2s ease-in-out,
        opacity 0.2s ease-in-out;
}

.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button:hover {
    border-color: var(--color-accent);
    background: #ffffff !important;
    color: var(--color-primary) !important;
}

/* Current (active) page */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.current,
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.current:hover {
    border-color: var(--color-accent);
}

/* Disabled state */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.disabled {
    display: none;
}

/* Previous / next arrows */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.previous,
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.next {
    position: relative;
    border: none;
    background: transparent !important;
    min-width: auto;
}

.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.previous::before,
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.next::before {
    content: "";
    display: inline-block;
    width: 49px;
    height: 40px;
    background-repeat: no-repeat;
    background-size: contain;
}

/* Use the same SVG chip as global pagination, rotated for previous */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.next::before {
    background-image: url("data:image/svg+xml,%3Csvg width='49' height='40' viewBox='0 0 49 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.5 2.01489C26.5986 2.01489 33.9999 9.50568 34 18.7776C34 28.0496 26.5987 35.5403 17.5 35.5403C8.40131 35.5403 1 28.0496 1 18.7776C1.00011 9.50568 8.40138 2.01489 17.5 2.01489Z' fill='%23F2CD47' stroke='%23F2CD47' stroke-width='2'/%3E%3Cg clip-path='url(%23clip0_3001_1999)'%3E%3Cpath d='M10.0534 22.0394C12.9021 20.4494 16.1381 20.0045 19.2321 19.4999C22.2904 19.0339 25.3837 18.7433 28.4408 18.6341C34.1996 18.4448 39.7423 19.1294 45.3202 19.918C43.613 20.2727 41.8707 20.4519 40.3768 20.789C39.8077 20.9072 39.448 22.2208 39.0211 22.3273C41.6887 21.7865 45.2436 21.6362 47.63 20.12C47.7724 20.0369 48.9854 18.6531 48.95 18.6203C46.1128 16.6429 43.0263 14.8643 39.6886 13.7841C39.5821 13.7572 38.6901 14.7937 38.761 14.8592L39.0792 15.3679L39.2932 15.1363C40.9609 16.0331 42.6286 16.93 44.2603 17.9368C39.2872 16.9913 33.9914 16.8928 28.9432 17.1661C23.184 17.498 16.1804 17.8968 10.9097 21.0416C10.5891 21.2463 10.3026 21.9119 10.0534 22.0394Z' fill='%231B1B1B'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3001_1999'%3E%3Crect width='26.5717' height='29.144' fill='white' transform='matrix(0.729402 0.684086 -0.673168 0.739489 29.6191 0)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.previous::before {
    transform: scaleX(-1);
    background-image: url("data:image/svg+xml,%3Csvg width='49' height='40' viewBox='0 0 49 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.5 2.01489C26.5986 2.01489 33.9999 9.50568 34 18.7776C34 28.0496 26.5987 35.5403 17.5 35.5403C8.40131 35.5403 1 28.0496 1 18.7776C1.00011 9.50568 8.40138 2.01489 17.5 2.01489Z' fill='%23F2CD47' stroke='%23F2CD47' stroke-width='2'/%3E%3Cg clip-path='url(%23clip0_3001_1999)'%3E%3Cpath d='M10.0534 22.0394C12.9021 20.4494 16.1381 20.0045 19.2321 19.4999C22.2904 19.0339 25.3837 18.7433 28.4408 18.6341C34.1996 18.4448 39.7423 19.1294 45.3202 19.918C43.613 20.2727 41.8707 20.4519 40.3768 20.789C39.8077 20.9072 39.448 22.2208 39.0211 22.3273C41.6887 21.7865 45.2436 21.6362 47.63 20.12C47.7724 20.0369 48.9854 18.6531 48.95 18.6203C46.1128 16.6429 43.0263 14.8643 39.6886 13.7841C39.5821 13.7572 38.6901 14.7937 38.761 14.8592L39.0792 15.3679L39.2932 15.1363C40.9609 16.0331 42.6286 16.93 44.2603 17.9368C39.2872 16.9913 33.9914 16.8928 28.9432 17.1661C23.184 17.498 16.1804 17.8968 10.9097 21.0416C10.5891 21.2463 10.3026 21.9119 10.0534 22.0394Z' fill='%231B1B1B'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3001_1999'%3E%3Crect width='26.5717' height='29.144' fill='white' transform='matrix(0.729402 0.684086 -0.673168 0.739489 29.6191 0)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

/* Hide default text inside prev/next, keep for screen readers */
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.previous,
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.next {
    color: transparent;
    font-size: 0;
}

.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.previous
    span,
.projects-list-section
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.next
    span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
