/* =========================================================
   MAIN CONTENT WRAPPERS
  ========================================================= */

body #mainContentContainer {
    display: block;
    position: static;
    float: none;
    clear: both;
    transform: none;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 20px 0;
    box-sizing: border-box;
}

    body #mainContentContainer > .container.body-content,
    body #mainContentContainer > .inmate-content-shell {
        display: block;
        position: static;
        float: none;
        transform: none;
        width: 100%;
        max-width: 1440px;
        min-width: 0;
        margin: 0 auto;
        /* ADJUST: Outer left/right spacing. */
        padding: 0 20px;
        box-sizing: border-box;
    }

/* =========================================================
   DETAILS PAGE
   ========================================================= */
.inmate-details-page,
.inmate-details-page *,
.inmate-details-page *::before,
.inmate-details-page *::after {
    box-sizing: border-box;
}

.inmate-details-page {
    width: 100%;
    max-width: 1400px;
    min-width: 0;
    margin: 0 auto;
}

    .inmate-details-page .details-heading {
        margin-bottom: 24px;
        text-align: center;
    }

        .inmate-details-page .details-heading h1 {
            margin: 0 0 10px;
            color: #343a40;
            font-size: clamp(24px, 3vw, 32px);
            font-weight: 700;
            line-height: 1.3;
        }

        .inmate-details-page .details-heading p {
            margin: 0;
            color: #526171;
            font-size: 17px;
            line-height: 1.5;
            overflow-wrap: anywhere;
        }

    /* =========================================================
   DEMOGRAPHICS CARD
  ========================================================= */
    .inmate-details-page .details-card {
        width: 100%;
        min-width: 0;
        margin-bottom: 24px;
        /* ADJUST: Space inside the demographics card. */
        padding: 24px;
        background: #f8fafc;
        border: 1px solid #d8e0e8;
        border-radius: 10px;
        box-shadow: 0 4px 14px rgba(30, 50, 70, 0.06);
    }

    .inmate-details-page .demographics-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 240px;
        align-items: start;
        /* ADJUST: Space between demographics and photograph. */
        gap: 28px;
    }

    .inmate-details-page .demographics-list {
        min-width: 0;
        margin: 0;
    }

    .inmate-details-page .demographics-item {
        display: grid;
        grid-template-columns: 180px minmax(0, 1fr);
        gap: 12px;
        padding: 13px 0;
        border-bottom: 1px solid #e0e6ec;
    }

        .inmate-details-page .demographics-item:last-child {
            border-bottom: 0;
        }

        .inmate-details-page .demographics-item dt {
            margin: 0;
            color: #526171;
            font-size: 16px;
            font-weight: 600;
            line-height: 1.5;
        }

        .inmate-details-page .demographics-item dd {
            min-width: 0;
            margin: 0;
            color: #263238;
            font-size: 17px;
            font-weight: 700;
            line-height: 1.5;
            overflow-wrap: anywhere;
        }

    /* =========================================================
   PHOTOGRAPH
   ========================================================= */
    .inmate-details-page .inmate-photo-panel {
        display: flex;
        justify-content: center;
        min-width: 0;
    }

    .inmate-details-page .inmate-photo {
        display: block;
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 280px;
        padding: 5px;
        background: #fff;
        border: 1px solid #cbd5df;
        border-radius: 8px;
    }

    .inmate-details-page .photo-placeholder {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 240px;
        min-height: 200px;
        padding: 20px;
        color: #526171;
        background: #edf2f7;
        border: 1px dashed #aebdca;
        border-radius: 8px;
        text-align: center;
        font-size: 16px;
        line-height: 1.5;
    }
    /* =========================================================
   RETURN LINK
   ========================================================= */
    .inmate-details-page .details-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 24px;
    }

    .inmate-details-page .return-search-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        max-width: 100%;
        padding: 10px 20px;
        border-radius: 6px;
        font-size: 16px;
        font-weight: 600;
        line-height: 1.5;
        white-space: normal;
        text-align: center;
    }

        .inmate-details-page .return-search-button:focus-visible {
            outline: 3px solid #245580;
            outline-offset: 3px;
        }
    /* =========================================================
   FACILITY NOTICE
   ========================================================= */
    .inmate-details-page .facility-notice {
        margin-top: 20px;
        padding: 16px;
        color: #263d50;
        background: #eaf2f8;
        border-left: 4px solid #337ab7;
        border-radius: 6px;
        font-size: 16px;
        line-height: 1.6;
        overflow-wrap: anywhere;
    }

        .inmate-details-page .facility-notice p {
            margin: 0;
        }

        .inmate-details-page .facility-notice a {
            color: #245580;
            font-weight: 700;
            text-decoration: underline;
        }

            .inmate-details-page .facility-notice a:focus-visible {
                outline: 2px solid #245580;
                outline-offset: 3px;
            }

  /* =========================================================
   BOOKING SECTIONS AND SCROLLING
  ========================================================= */
    .inmate-details-page .bookings-section {
        width: 100%;
        min-width: 0;
        margin-bottom: 26px;
    }

    .inmate-details-page .booking-scroll-hint {
        margin: 0 0 8px;
        color: #526171;
        font-size: 14px;
        line-height: 1.5;
    }

    .inmate-details-page .booking-scroll {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

        .inmate-details-page .booking-scroll:focus-visible {
            outline: 2px solid #337ab7;
            outline-offset: 2px;
        }

    .inmate-details-page .booking-table {
        width: 100%;
        /* ADJUST: Minimum width for the ten booking columns.

       Smaller screens scroll inside .booking-scroll. */

        min-width: 1200px;
    }

        .inmate-details-page .booking-table .jtable-main-container {
            width: 100%;
            font-size: 16px;
        }

        /* =========================================================

   TABLE TITLES

   ========================================================= */
        .inmate-details-page .booking-table .jtable-title {
            height: auto;
            min-height: 46px;
            color: #fff;
            background: #344b5e;
        }

        .inmate-details-page .booking-table .jtable-title-text {
            font-size: 18px;
            font-weight: 700;
            line-height: 46px;
        }


        /* =========================================================
   TABLE LAYOUT
   ========================================================= */
        .inmate-details-page .booking-table table.jtable {
            width: 100%;
            table-layout: fixed;
        }

            /* =========================================================
   COLUMN HEADINGS
   Reset the inner header height so wrapped headings do not
   overlap the first data row.
   ========================================================= */

            .inmate-details-page .booking-table table.jtable thead th {
                height: auto !important;
                padding: 12px 10px;
                color: #263d50;
                background: #edf2f7;
                border-color: #d8e0e8;
                font-size: 15px;
                font-weight: 700;
                line-height: 1.5;
                vertical-align: middle;
                /* Wrap at spaces, not inside words. */

                white-space: normal;
                overflow-wrap: normal;
                word-break: normal;
            }

        .inmate-details-page .booking-table

        .jtable-column-header-container {
            height: auto !important;
            min-height: 24px;
        }

        .inmate-details-page .booking-table
        .jtable-column-header-text {
            position: static;
            display: block;
            height: auto !important;
            font-size: inherit;
            line-height: 1.5;
            white-space: normal;
            overflow-wrap: normal;
            word-break: normal;
        }

        /* =========================================================
   BOOKING DATA
   ========================================================= */

        .inmate-details-page .booking-table table.jtable tbody td {
            /* ADJUST: Space inside each data cell. */

            padding: 12px 10px;
            color: #263238;
            border-color: #e0e6ec;
            /* ADJUST: Booking data text size. */

            font-size: 16px;
            line-height: 1.6;
            vertical-align: top;
            white-space: normal;
            overflow-wrap: anywhere;
            word-break: normal;
        }

            /* Column 2: Case number or warrant number.

   Column 3: Booking number.

   Keep these identifiers together. */

            .inmate-details-page .booking-table table.jtable tbody td:nth-child(2),
            .inmate-details-page .booking-table table.jtable tbody td:nth-child(3) {
                white-space: nowrap;
                overflow-wrap: normal;
                word-break: normal;
            }

        /* =========================================================
   TABLE ROW COLORS
   ========================================================= */


        .inmate-details-page .booking-table table.jtable tbody tr:nth-child(odd) {
            background: #fff;
        }


        .inmate-details-page .booking-table table.jtable tbody tr:nth-child(even) {
            background: #f5f8fb;
        }


        .inmate-details-page .booking-table table.jtable tbody tr:hover {
            background: #eaf2fa;
        }

/* =========================================================
   TABLETS
   ========================================================= */
@media (max-width: 900px) {
    .inmate-details-page .demographics-layout {
        grid-template-columns: minmax(0, 1fr) 200px;
        gap: 20px;
    }

    .inmate-details-page .demographics-item {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }
}
/* =========================================================
   PHONES
  ========================================================= */
@media (max-width: 600px) {

    body #mainContentContainer {
        padding: 16px 0;
    }



        body #mainContentContainer > .container.body-content,
        body #mainContentContainer > .inmate-content-shell {
            /* ADJUST: Outer left/right spacing on phones. */

            padding: 0 12px;
        }

    .inmate-details-page .details-heading {
        margin-bottom: 18px;
    }

        .inmate-details-page .details-heading p {
            font-size: 16px;
        }

    .inmate-details-page .details-card {
        /* ADJUST: Card spacing on phones. */
        padding: 16px;
    }

    .inmate-details-page .demographics-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    .inmate-details-page .inmate-photo {
        max-height: 240px;
    }

    .inmate-details-page .return-search-button {
        width: 100%;
    }

    .inmate-details-page .facility-notice {
        padding: 14px;
    }
}
/* Outer card around details and active bookings */

.inmate-details-card {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    background: #fff;
    border: 1px solid #d7dce2;
    border-radius: 12px;
    /* ADJUST: Inner spacing. */

    padding: 24px;
    /* Space around the outside shadow. */

    margin: 16px 0 32px;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.10), 0 18px 40px rgba(15, 23, 42, 0.14);
}

    /* Remove separate table shadows */

    .inmate-details-card .jtable-main-container {
        box-shadow: none;
    }

@media (max-width: 600px) {

    .inmate-details-card {
        padding: 14px;
    }
}
/* Hide on desktop */
.booking-scroll-hint {
    display: none;
}
/* Show on small screens */
@media (max-width: 767px) {
    .booking-scroll-hint {
        display: block;
        margin: 12px 0 8px;
        font-size: 12px;
        color: #555;
    }
}
/* Keep booking values inside their own columns. */
body #mainContentContainer .inmate-details-card table.jtable {
    width: 100%;
    table-layout: fixed;
}

    body #mainContentContainer .inmate-details-card table.jtable th,
    body #mainContentContainer .inmate-details-card table.jtable td {
        white-space: normal;
        overflow-wrap: anywhere;
        word-wrap: break-word;
        vertical-align: top;
    }

    body #mainContentContainer .inmate-details-card table.jtable tbody td {
        padding: 12px 10px;
        height: auto;
        line-height: 1.5;
    }
/* =====================================================
  DETAILS PAGE — VISUAL REFINEMENTS
  ===================================================== */
body #mainContentContainer {
    background: #f4f6f8;
}

    body #mainContentContainer .inmate-details-page {
        color: #243447;
        font-family: "Segoe UI", Arial, sans-serif;
        font-size: 16px;
        line-height: 1.6;
    }
    /* Page heading */
    body #mainContentContainer .inmate-details-title {
        margin: 0 0 12px;
        color: #203b4b;
        font-size: 28px;
        font-weight: 700;
        line-height: 1.3;
        letter-spacing: 0.3px;
    }
    /* Booking table container */
    body #mainContentContainer
    .inmate-details-card .jtable-main-container {
        border: 1px solid #dce3e9;
        border-radius: 8px;
        box-shadow: none;
    }
    /* Booking section heading */
    body #mainContentContainer
    .inmate-details-card .jtable-title {
        height: auto;
        min-height: 48px;
        padding: 0 16px;
        color: #fff;
        background: #203b4b;
        border-radius: 7px 7px 0 0;
    }

    body #mainContentContainer
    .inmate-details-card .jtable-title-text {
        float: none;
        font-family: "Segoe UI", Arial, sans-serif;
        font-size: 17px;
        font-weight: 600;
        line-height: 48px;
        text-shadow: none;
    }
    /* Column headings */
    body #mainContentContainer
    .inmate-details-card table.jtable thead th {
        height: auto;
        padding: 14px 12px;
        color: #334b5d;
        background: #edf2f6;
        border-color: #dce3e9;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.5;
    }
    /* Booking values */
    body #mainContentContainer
    .inmate-details-card table.jtable tbody td {
        height: auto;
        padding: 14px 12px;
        color: #243447;
        border-color: #e4e9ee;
        font-size: 15px;
        line-height: 1.6;
        vertical-align: top;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    body #mainContentContainer
    .inmate-details-card table.jtable tbody tr:nth-child(odd) {
        background: #fff;
    }

    body #mainContentContainer
    .inmate-details-card table.jtable tbody tr:nth-child(even) {
        background: #f7f9fb;
    }

    body #mainContentContainer
    .inmate-details-card table.jtable tbody tr:hover {
        background: #edf4f9;
    }
/* Refine the outer card on desktop */
@media (min-width: 768px) {
    body #mainContentContainer .inmate-details-card {
        padding: 28px;
        background: #fff;
        border: 1px solid #dce3e9;
        border-radius: 12px;
        box-shadow: 0 6px 24px rgba(25, 45, 65, 0.08);
    }
}