/* ── Innova table – matches the old jsgrid-table visual style ── */

/* ── Page header ──────────────────────────────────────────────── */
.innova-count-badge {
    background-color: var(--innova-nav-blue);
    color: #fff;
    border-radius: 50px;
    padding: 0.25em 0.75em;
    font-size: 1rem;
    font-weight: 500;
    font-family: var(--innova-font);
}

/* ── Table wrapper ────────────────────────────────────────────── */
.innova-table-wrap {
    width: 100%;
    overflow-x: auto;
}

/* ── Table base ───────────────────────────────────────────────── */
.innova-table {
    width: 100%;
    background: #fff;
    border-collapse: separate; /* required for box-shadow on thead tr */
    border-spacing: 0;
    padding-bottom: 0.9375rem;
}

/* ── Header row ───────────────────────────────────────────────── */
.innova-table thead {
    height: 3.25rem;
}

.innova-table thead tr {
    box-shadow: rgba(0, 88, 255, 0.2) 0 8px 24px;
}

.innova-table thead th {
    background: #fff;
    color: #1a1a1a;
    font-size: 1.375rem;
    font-weight: 500;
    border: none;
    border-top: 1px solid rgba(0, 88, 255, 0.5);
    border-bottom: 1px solid rgba(0, 88, 255, 0.5);
    border-right: 1px solid rgba(0, 88, 255, 0.18);
    padding: 0 1rem;
    position: relative;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

/* RTL: first-child renders on the far RIGHT → rounded top-right corner */
.innova-table thead th:first-child {
    border-right-color: rgba(0, 88, 255, 0.5);
    border-radius: 0 1.125rem 0 0;
}

/* RTL: last-child renders on the far LEFT → rounded top-left corner */
.innova-table thead th:last-child {
    border-right: none;
    border-left: 1px solid rgba(0, 88, 255, 0.5);
    border-radius: 1.125rem 0 0 0;
}

/* ── Body rows ────────────────────────────────────────────────── */
.innova-table tbody tr {
    transition: background-color 0.12s ease;
}

.innova-table tbody td {
    font-size: 1.25rem;
    font-weight: 400 !important; /* override Bootstrap fw-semibold on name column */
    padding: 0.8125rem 1rem;
    border: none;
    border-bottom: 1px solid #ebebeb;
    text-align: right;
    vertical-align: middle;
    background-color: #fff;
}

/* Alternating row — matches old .jsgrid-alt-row */
.innova-table tbody tr:nth-child(even) td {
    background-color: #EDEDED;
}

/* Hover — must come after even-row to override it */
.innova-table tbody tr:hover td {
    background-color: rgba(0, 88, 255, 0.06);
}

/* Action column aligned to end in RTL = visual left */
.innova-table tbody td:last-child {
    text-align: left;
}

/* ── Details button (targets .view-btn from generated rows) ───── */
.view-btn {
    display:         inline-flex !important;
    align-items:     center      !important;
    justify-content: center      !important;
    font-family:    var(--innova-font)         !important;
    font-weight:    500                        !important;
    font-size:      1rem                       !important;
    color:          var(--innova-blue)         !important;
    background-color: #fff                     !important;
    border:         1px solid var(--innova-blue) !important;
    border-radius:  var(--innova-radius-btn)   !important;
    padding:        0.2em 1.1em               !important;
    min-width:      5.5rem;
    cursor:         pointer;
    text-decoration: none;
    transition:     background-color 0.15s ease;
}
.view-btn:hover {
    background-color: rgba(238, 244, 255, 1) !important;
    color: var(--innova-blue) !important;
}
.view-btn:active {
    background-color: rgba(219, 231, 255, 1) !important;
}

/* ── Pagination ───────────────────────────────────────────────── */
#pagination {
    margin-top: 1.25rem;
}

#pagination-info {
    font-family: var(--innova-font);
    font-size: 0.9rem;
    color: #6c757d;
    direction: rtl;
}

#pagination .pagination {
    gap: 4px;
    margin-bottom: 0;
}

#pagination .page-item .page-link {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    min-width:       40px;
    height:          40px;
    border-radius:   8px !important;
    border-color:    #dee2e6;
    color:           var(--innova-blue);
    font-family:     var(--innova-font);
    font-size:       0.9rem;
    font-weight:     500;
    transition:      background-color 0.15s, color 0.15s, border-color 0.15s;
}

#pagination .page-item.active .page-link,
#pagination .page-link#page-indicator {
    background-color: var(--innova-nav-blue);
    border-color:     var(--innova-nav-blue);
    color:            #fff;
    pointer-events:   none;
}

#pagination .page-item.disabled .page-link {
    color:            #adb5bd;
    background-color: #fff;
    border-color:     #dee2e6;
}

#pagination .page-item:not(.disabled) .page-link:hover {
    background-color: rgba(238, 244, 255, 1);
    color:            var(--innova-blue);
    border-color:     var(--innova-blue);
}