/* ============================================================
   DARMHA GridView styles — SINGLE SOURCE OF TRUTH
   ============================================================
   Palette (state / enterprise UI): navy, slate, silver, white, black.
   Use hex only — avoid CSS named colors and saturated accent hues
   (no bright green, red, orange, etc.) on grid chrome and links.

   Two grid types. Each <asp:GridView> picks one:

       CssClass="gv-card"     → card-per-row with kv label/value
                                (AMHH/BPHC care-plan search)

       CssClass="gv-tabular"  → regular tabular layout
                                (ConsumerSearch / AdminConsumerSearch)

       CssClass="dmha-gv"     → opt-in single class; edit CUSTOM vars in grid.css
                                (header height/bg without fighting SiteMaster)

   For alternating rows on .gv-card, also add:
       RowStyle-CssClass="gv-row"
       AlternatingRowStyle-CssClass="gv-row-alt"

   No `grid-item` mixin needed. No inline <style> overrides per page.
   Loaded once from Site.Master so it applies everywhere.
   ============================================================ */


/* ─────────────────────────────────────────────────────────────
   GRIDVIEW-CARD STYLE (each row is a card with kv label/value)
   ───────────────────────────────────────────────────────────── */

.gv-card {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    font-family: 'Segoe UI', system-ui, sans-serif;
}

.gv-card th {
    background: linear-gradient(180deg, #7a94b8 0%, #5a7394 42%, #2d3f5c 100%);
    color: #ffffff;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    padding: 5px 10px;
    border-top: 1px solid #a8b8d0;
    border-bottom: 2px solid #1a2533;
    border-right: 1px solid rgba(255,255,255,0.18);
    text-align: left;
    white-space: nowrap;
    text-shadow: 0 1px 1px rgba(0,0,0,0.35);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.25),
                inset 0 -1px 0 rgba(0,0,0,0.2);
}
.gv-card th a, .gv-card th a:visited { color: #ffffff; text-decoration: none; }
.gv-card th a:hover { color: #e3f0ff; text-decoration: underline; }

/* Row height grows with content */
.gv-card tr { height: auto; min-height: 0; max-height: none; }
.gv-card td {
    padding: 5px 10px;
    border-bottom: 1px solid #c8dced;
    border-right: 1px solid #ddeaf4;
    vertical-align: top;
    color: #1c2d44;
    font-size: 13px;
    height: auto;
    white-space: normal;
}

/* All rows same color — alternation removed site-wide */
.gv-card tr.gv-row    td { background: #ffffff; }
.gv-card tr.gv-row-alt td { background: #f4f5f7; }
.gv-card tr:nth-child(odd)  td { background: #ffffff; }
.gv-card tr:nth-child(even) td { background: #f4f5f7; }

/* First column (action) — vertically centered, narrow */
.gv-card td:first-child {
    width: 110px;
    white-space: nowrap;
    border-right: 2px solid #90bcd8;
    vertical-align: middle;
}
.gv-card td:last-child,
.gv-card th:last-child {
    border-right: none;
}

.gv-card .link-action {
    color: #0d3b80;
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
}
.gv-card .link-action:hover {
    text-decoration: underline;
    color: #1a4f7a;
}

/* kv grid — label/value pairs inside a row cell */
.gv-card .kv {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 2px 8px;
    align-items: baseline;
    width: 100%;
}
.gv-card .kv .k {
    font-size: 11px;
    font-weight: 700;
    color: #7080a0;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
}
.gv-card .kv .v {
    font-size: 12.5px;
    color: #0d2a5e;
    word-break: break-word;
}
.gv-card .kv .v.name {
    font-weight: 800;
    font-size: 13.5px;
    color: #0d3b80;
}
.gv-card .kv .v.bold   { font-weight: 800; }
.gv-card .kv .v.status { font-weight: 800; color: #0d3b80; }
.gv-card .kv .v.alert  { color: #4a5568; font-style: italic; }
.gv-card .kv .v.muted  { color: #7080a0; font-size: 11.5px; }
.gv-card .kv .v.fullrow { grid-column: 1 / -1; }
.gv-card .kv-divider {
    grid-column: 1 / -1;
    height: 1px;
    background: #dde6f0;
    margin: 3px 0 1px 0;
}

/* One label + value per row (IDs / Status column — avoids grid wrap issues) */
.gv-card .kv.kv-ids {
    display: block !important;
    width: 100%;
}
.gv-card .kv.kv-ids .kv-divider {
    display: block;
    width: 100%;
    margin: 6px 0 4px 0;
}
.gv-card .kv-line {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 6px 10px;
    width: 100%;
    margin-bottom: 4px;
    text-align: left;
}
.gv-card .kv-line:last-child {
    margin-bottom: 0;
}
.gv-card .kv-line .k {
    font-size: 11px;
    font-weight: 700;
    color: #7080a0;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
    flex: 0 0 auto;
}
.gv-card .kv-line .v {
    font-size: 12.5px;
    color: #0d2a5e;
    word-break: break-word;
    min-width: 0;
    flex: 1 1 auto;
}
.gv-card .kv-line .v.bold { font-weight: 800; }
.gv-card .kv-line .v.status { font-weight: 800; color: #0d3b80; }
.gv-card .kv-line .v.muted { color: #7080a0; font-size: 11.5px; font-style: italic; }
.gv-card .kv-line .v.alert { color: #4a5568; font-style: italic; }


/* ─────────────────────────────────────────────────────────────
   REGULAR TABULAR STYLE
   ───────────────────────────────────────────────────────────── */

.gv-tabular {
    width: 100%;
    border: 1px solid #e3e9f1;
    border-radius: 6px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    background: #ffffff;
    font-family: 'Segoe UI', system-ui, sans-serif;
}

.gv-tabular th {
    background: #f2f4f7;
    color: #0d3b80;
    height: auto;
    box-sizing: border-box;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    border-bottom: 1px solid #c9d3e2;
    padding: 10px 12px;
    line-height: 1.2;
    vertical-align: middle;
}
.gv-tabular th a, .gv-tabular th a:visited { color: #0d3b80; text-decoration: none; }
.gv-tabular th a:hover { color: #0a2c64; text-decoration: underline; }

/* ─────────────────────────────────────────────────────────────
   MODULETABS DARMHA — gv-tabular (Assessment + consumer tabs)
   Full-bleed: cancels SiteMaster UpdatePanel horizontal padding (~14px).
   ───────────────────────────────────────────────────────────── */
body:has(.darmha-tabs) table.gv-tabular {
    --dmha-tab-card-pad-x: 14px;
    width: calc(100% + 2 * var(--dmha-tab-card-pad-x)) !important;
    max-width: none !important;
    margin-left: calc(-1 * var(--dmha-tab-card-pad-x)) !important;
    margin-right: calc(-1 * var(--dmha-tab-card-pad-x)) !important;
    table-layout: auto !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
    border-top: 1px solid #b8c8da !important;
    border-bottom: 0 !important;
}
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:last-child > td {
    border-bottom: 1px solid #e4ebf4 !important;
}

body:has(.darmha-tabs) table.gv-tabular tr:first-child th,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th {
    background: #ffffff !important;
    background-image: none !important;
    color: #0d3b80 !important;
    border-bottom: 1px solid #c8d8ec !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    text-transform: uppercase !important;
    padding: 2px 10px !important;
    height: 34px !important;
    vertical-align: middle !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body:has(.darmha-tabs) table.gv-tabular th a,
body:has(.darmha-tabs) table.gv-tabular th a:visited {
    color: #0d3b80 !important;
    text-decoration: none !important;
}

body:has(.darmha-tabs) table.gv-tabular th a:hover {
    color: #082a5c !important;
    text-decoration: underline !important;
}

body:has(.darmha-tabs) table.gv-tabular td {
    padding: 7px 12px !important;
    border-bottom: 1px solid #e4ebf4 !important;
    vertical-align: middle !important;
}

body:has(.darmha-tabs) table.gv-tabular tr:nth-child(odd) td,
body:has(.darmha-tabs) table.gv-tabular tr:nth-child(even) td {
    background: #ffffff !important;
}

body:has(.darmha-tabs) table.gv-tabular tr:hover td {
    background: #e8eef6 !important;
}

body:has(.darmha-tabs) table.gv-tabular tr.gv-selected td,
body:has(.darmha-tabs) table.gv-tabular tr.grid-selected-row td {
    background: #dce6f2 !important;
    color: #0a2c64 !important;
    font-weight: 600 !important;
    box-shadow: inset 3px 0 0 #5a7394 !important;
}

body:has(.darmha-tabs) table.gv-tabular .pgr {
    background: linear-gradient(180deg, #f2f5f9 0%, #e8edf4 100%) !important;
    border-top: 1px solid #c5d4e2 !important;
    padding: 8px 12px !important;
}

.gv-tabular tr { height: auto; min-height: 0; max-height: none; }
.gv-tabular td {
    background: #ffffff;
    color: #1c2433;
    font-size: 13px;
    font-weight: 400;
    padding: 5px 8px;
    line-height: 1.35;
    white-space: normal;
    vertical-align: middle;
    border-bottom: 1px solid #f3f5f9;
    border-right: none;
}

.gv-tabular tr.gv-row    td { background: #ffffff; }
.gv-tabular tr.gv-row-alt td { background: #f4f5f7; }
.gv-tabular tr:nth-child(odd)  td { background: #ffffff; }
.gv-tabular tr:nth-child(even) td { background: #f4f5f7; }
.gv-tabular tr.gv-selected td {
    background: #e8f0fa;
    color: #0a2c64;
    font-weight: 600;
    box-shadow: inset 3px 0 0 #5a7394;
}

/* Pager */
.gv-tabular .pgr {
    background: #f7fafd;
    border-top: 1px solid #e3e9f1;
    padding: 6px 12px;
}
.gv-tabular .pgr a {
    color: #0d3b80;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 3px;
}
.gv-tabular .pgr a:hover { background: #e8f0fa; }


/* ─────────────────────────────────────────────────────────────
   COLUMN UTILITY CLASSES — work in both grid types
   Apply via HeaderStyle-CssClass="col-..." ItemStyle-CssClass="col-..."
   ───────────────────────────────────────────────────────────── */

.gv-card th.col-id,    .gv-card td.col-id,
.gv-tabular th.col-id, .gv-tabular td.col-id {
    width: 100px;
    min-width: 100px;
    max-width: 100px;
    white-space: nowrap;
    text-align: left;
}

/* Date cells stay fixed; header text can wrap (e.g. "Episode Start" + uppercase) */
.gv-card th.col-date,
.gv-tabular th.col-date {
    width: auto;
    min-width: 104px;
    max-width: none;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.2;
    text-align: left;
}
.gv-card td.col-date,
.gv-tabular td.col-date {
    width: 110px;
    min-width: 110px;
    max-width: 110px;
    white-space: nowrap;
    text-align: left;
}

.gv-card th.col-datetime,    .gv-card td.col-datetime,
.gv-tabular th.col-datetime, .gv-tabular td.col-datetime {
    width: 150px;
    min-width: 150px;
    max-width: 150px;
    white-space: nowrap;
    text-align: left;
}

.gv-card th.col-num,    .gv-card td.col-num,
.gv-tabular th.col-num, .gv-tabular td.col-num {
    width: 70px;
    min-width: 70px;
    max-width: 70px;
    white-space: nowrap;
    text-align: center;
}

/* Bool cells stay narrow (Y/N, checks); headers need full labels (e.g. Recovery Works) */
.gv-card th.col-bool,
.gv-tabular th.col-bool {
    width: auto;
    min-width: 72px;
    max-width: none;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.2;
    text-align: center;
}
.gv-card td.col-bool,
.gv-tabular td.col-bool {
    width: 70px;
    min-width: 70px;
    max-width: 90px;
    text-align: center;
}

.gv-card th.col-money,    .gv-card td.col-money,
.gv-tabular th.col-money, .gv-tabular td.col-money {
    width: 110px;
    min-width: 110px;
    text-align: right;
    white-space: nowrap;
}

.gv-card th.col-action,    .gv-card td.col-action,
.gv-tabular th.col-action, .gv-tabular td.col-action {
    width: 100px;
    min-width: 100px;
    max-width: 100px;
    white-space: nowrap;
    text-align: left;
}


/* ============================================================
   OPT-IN: ONE CLASS ON THE GRIDVIEW (predictable header / layout)

   Problem: SiteMaster.css targets .mGrid / .grid-item / body:has(...) with
   many !important rules. Per-page <style> often loses. Inline HeaderStyle-*
   on <th> always wins over normal CSS.

   Fix: Put a single class on the grid and edit ONLY this block.

       <asp:GridView ID="GridView1" runat="server"
           CssClass="dmha-gv"
           ... >

   • Remove CssClass="mGrid grid-item" (or keep only dmha-gv) so old global
     header rules do not target the same cells.
   • Remove HeaderStyle-BackColor, HeaderStyle-Height, HeaderStyle-ForeColor,
     HeaderStyle-BorderWidth (etc.) from the .aspx — let this CSS own the header.
     If you must keep one inline attribute, expect it to override this block.
   • Sort links: styled via .dmha-gv th a below.

   Tweak the CUSTOM section variables only — no scoping chains elsewhere.
   ============================================================ */

/* ---- CUSTOM (edit these) ---- */
table.dmha-gv {
    --dmha-gv-hdr-bg: #0d3b80;
    --dmha-gv-hdr-fg: #ffffff;
    --dmha-gv-hdr-h: 40px;
    --dmha-gv-border: #c8d8ec;
}

/* ---- Table shell ---- */
table.dmha-gv {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 13px;
    background: #fff;
    border: 1px solid var(--dmha-gv-border);
    margin: 6px 0 12px 0;
    box-sizing: border-box;
}

/* Header row: ASP.NET usually renders first <tr> of <tbody> with <th> */
table.dmha-gv > tbody > tr:first-child > th,
table.dmha-gv thead > tr > th {
    background: var(--dmha-gv-hdr-bg) !important;
    background-image: none !important;
    color: var(--dmha-gv-hdr-fg) !important;
    height: var(--dmha-gv-hdr-h) !important;
    min-height: var(--dmha-gv-hdr-h) !important;
    max-height: none !important;
    padding: 6px 10px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.35px;
    vertical-align: middle !important;
    text-align: left !important;
    border: none !important;
    border-right: 1px solid rgba(255, 255, 255, 0.22) !important;
    border-bottom: 2px solid rgba(0, 0, 0, 0.2) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    white-space: nowrap;
    box-sizing: border-box !important;
}

table.dmha-gv > tbody > tr:first-child > th:last-child,
table.dmha-gv thead > tr > th:last-child {
    border-right: none !important;
}

table.dmha-gv > tbody > tr:first-child > th a,
table.dmha-gv > tbody > tr:first-child > th a:visited,
table.dmha-gv thead > tr > th a,
table.dmha-gv thead > tr > th a:visited {
    color: var(--dmha-gv-hdr-fg) !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

table.dmha-gv > tbody > tr:first-child > th a:hover,
table.dmha-gv thead > tr > th a:hover {
    color: #e3f2ff !important;
    text-decoration: underline !important;
}

/* Body rows (simple default; extend below if needed) */
table.dmha-gv > tbody > tr:not(:first-child) > td,
table.dmha-gv > tbody > tr.grid-row > td,
table.dmha-gv > tbody > tr.grid-row-hover > td {
    padding: 5px 10px;
    border-bottom: 1px solid #e8eef7;
    vertical-align: middle;
    color: #1c2d44;
    background: #fff;
}

table.dmha-gv > tbody > tr:not(:first-child):nth-child(even) > td {
    background: #ffffff;
}

table.dmha-gv > tbody > tr:not(:first-child):hover > td {
    background: #e3f2fd;
}

/* ============================================================
   Last column of every GridView: left-justify BOTH the header
   and the data cells (was defaulting to right-justified on many
   pages, which looked off against the rest of the columns).
   Applies to all GridView styles used in DARMHA.
   ============================================================ */
table.gv-tabular > tbody > tr > th:last-child,
table.gv-tabular > tbody > tr > td:last-child,
table.gv-card    > tbody > tr > th:last-child,
table.gv-card    > tbody > tr > td:last-child,
table.grid-item  > tbody > tr > th:last-child,
table.grid-item  > tbody > tr > td:last-child,
table.mGrid      > tbody > tr > th:last-child,
table.mGrid      > tbody > tr > td:last-child,
table.dmha-gv    > tbody > tr > th:last-child,
table.dmha-gv    > tbody > tr > td:last-child,
table[id*="GridView"] > tbody > tr > th:last-child,
table[id*="GridView"] > tbody > tr > td:last-child,
table[rules="all"]    > tbody > tr > th:last-child,
table[rules="all"]    > tbody > tr > td:last-child {
    text-align: left !important;
}

/* ============================================================
   Buttons placed inside GridView data cells (Select button,
   inline action buttons, etc.) get 5px left padding so they
   don't hug the cell's left edge.
   ============================================================ */
table.gv-tabular > tbody > tr > td input[type="submit"],
table.gv-tabular > tbody > tr > td input[type="button"],
table.gv-tabular > tbody > tr > td a.grid-select-btn,
table.gv-card    > tbody > tr > td input[type="submit"],
table.gv-card    > tbody > tr > td input[type="button"],
table.gv-card    > tbody > tr > td a.grid-select-btn,
table.grid-item  > tbody > tr > td input[type="submit"],
table.grid-item  > tbody > tr > td input[type="button"],
table.grid-item  > tbody > tr > td a.grid-select-btn,
table.mGrid      > tbody > tr > td input[type="submit"],
table.mGrid      > tbody > tr > td input[type="button"],
table.dmha-gv    > tbody > tr > td input[type="submit"],
table.dmha-gv    > tbody > tr > td input[type="button"],
table[id*="GridView"] > tbody > tr > td input[type="submit"],
table[id*="GridView"] > tbody > tr > td input[type="button"],
table[rules="all"]    > tbody > tr > td input[type="submit"],
table[rules="all"]    > tbody > tr > td input[type="button"] {
    padding-left: 5px !important;
}
