/* ===============================
   INDEX HEADER STRIP (GLOBAL)
   Used by Inward / Outward / Booking
   =============================== */

.index-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    background-color: deepskyblue;
    color: #fff;
    border-radius: 3px;
    padding: 0 10px;
}

    /* Title (left side) */
    .index-strip .index-title {
        font-size: 16px;
        font-weight: 500;
        white-space: nowrap;
    }

    /* Search textbox */
    .index-strip .index-search {
        max-width: 260px;
        height: 28px;
        font-size: 13px;
    }

    /* Date picker */
    .index-strip .index-date {
        height: 28px;
        font-size: 13px;
    }

    /* Buttons */
    .index-strip .btn {
        height: 28px;
        font-size: 13px;
        padding: 0 10px;
    }

    /* Push right-side items (date) */
    .index-strip .push-right {
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 5px;
    }

/* ===============================
   GRID CONTAINER (INDEX PAGES)
   =============================== */

.index-grid {
    padding: 6px 8px 8px 8px;
}

    .index-grid table {
        margin-bottom: 0;
    }

    /* Empty grid row */
    .index-grid .empty-row {
        text-align: center;
        font-weight: 500;
        color: #6c757d;
    }
.grid-wrapper {
    max-width: 1000px; /* SAFE for 1024x768 */
    margin: 0 auto; /* Center on large monitors */
    overflow-x: auto; /* Safety net */
}
.table {
    font-size: 13px;
}

    .table th,
    .table td {
        padding: 6px 8px;
    }

/* Grid Header */
.table thead th {
    background: linear-gradient(135deg, #0ea5e9, #2563eb);
    color: #ffffff;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    border-bottom: 2px solid #1e40af;
    white-space: nowrap;
}
.table tbody td {
    vertical-align: middle;
    white-space: nowrap;
}

/* =============================== */
/* PAGINATION (GLOBAL STANDARD)    */
/* =============================== */

.index-pagination {
    display: flex;
    justify-content: center; /* ⭐ centers page numbers */
    margin: 10px 0;
}

.btn-create {
    height: 36px;
    padding: 0 14px; /* ⭐ fixes square */
    min-width: 90px; /* ⭐ consistent width */
    white-space: nowrap;
}

.filter-bar {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.text-ellipsis {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.table th,
.table td {
    white-space: nowrap;
}
.action-buttons .btn {
    padding: 3px 8px;
    font-size: 11px;
    border-radius: 5px;
}