/* ============================================================
   tabs.css — single source of truth for ModuleTabs* user controls
   Replaces inline <style> blocks previously in:
     ModuleTabsDARMHA.ascx, ModuleTabsCarePlan.ascx,
     ModuleTabsProvider.ascx, ModuleTabsUserManager.ascx
   Codebehinds toggle CssClass between "Initial" and "Clicked"
   on asp:Button controls. The buttons render as <input type=submit>.
   No !important by design — page-level overrides win via specificity.
   ============================================================ */

/* --- Wrapper: a flex row of tab buttons, with a 2px navy underline --- */
.tab-bar {
    display: flex;
    align-items: flex-end;
    gap: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    border-bottom: 2px solid #0d3b80;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 0;
    line-height: 0;
}

/* div_* wrappers around each asp:Button must not break the flex row */
.tab-bar > div,
.tab-bar > span {
    display: inline-flex;
    align-items: flex-end;
    margin: 0;
    padding: 0;
}

/* --- Inactive tab (codebehind: CssClass="Initial") --- */
.Initial,
input[type="submit"].Initial,
input[type="button"].Initial {
    display: inline-block;
    box-sizing: border-box;
    padding: 4px 12px 4px 10px;
    margin: 0;
    border: 1px solid #c8d8ec;
    border-bottom: none;
    background: #fff;
    color: #506080;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    cursor: pointer;
    white-space: nowrap;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%);
    position: relative;
    z-index: 1;
    transition: color 0.15s ease, background 0.15s ease;
}
.Initial:hover {
    background: #f0f6fd;
    color: #0d3b80;
    z-index: 2;
}
.Initial[disabled],
.Initial:hover[disabled] {
    background: #f4f6fa;
    color: #a8b5c4;
    cursor: default;
    pointer-events: none;
}

/* --- Active tab (codebehind: CssClass="Clicked") --- */
.Clicked,
input[type="submit"].Clicked,
input[type="button"].Clicked {
    display: inline-block;
    box-sizing: border-box;
    padding: 4px 12px 4px 10px;
    margin: 0;
    border: 1px solid #0d3b80;
    border-bottom: none;
    background: linear-gradient(180deg, #6b86a8 0%, #4d6788 45%, #2d3f5c 100%);
    color: #fff;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
    cursor: default;
    white-space: nowrap;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%);
    letter-spacing: 0.3px;
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    position: relative;
    z-index: 3;
}

/* --- Bootstrap nav-tabs — same slant style as .Initial/.Clicked --- */
.nav.nav-tabs {
    display: flex;
    align-items: flex-end;
    gap: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    border-bottom: 2px solid #0d3b80;
    list-style: none;
}
.nav.nav-tabs > li,
.nav.nav-tabs > .nav-item {
    margin: 0;
    padding: 0;
    border: none;
    list-style: none;
}
.nav.nav-tabs > li > a,
.nav.nav-tabs .nav-link {
    display: inline-block;
    box-sizing: border-box;
    padding: 4px 12px 4px 10px;
    margin: 0;
    border: 1px solid #c8d8ec;
    border-bottom: none;
    background: #fff;
    color: #506080;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%);
    position: relative;
    z-index: 1;
    transition: color 0.15s ease, background 0.15s ease;
}
.nav.nav-tabs > li > a:hover,
.nav.nav-tabs .nav-link:hover {
    background: #f0f6fd;
    color: #0d3b80;
    z-index: 2;
}
.nav.nav-tabs > li.active > a,
.nav.nav-tabs > li > a.active,
.nav.nav-tabs .nav-link.active {
    border-color: #0d3b80;
    background: linear-gradient(180deg, #6b86a8 0%, #4d6788 45%, #2d3f5c 100%);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    cursor: default;
    z-index: 3;
}

/* Vertical Admission/Discharge rail — not the slanted horizontal tab strip */
.nav.nav-tabs.left-tabs.sideways-tabs {
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    border-bottom: none !important;
    background: transparent;
}
.nav.nav-tabs.left-tabs.sideways-tabs > li,
.nav.nav-tabs.left-tabs.sideways-tabs > .nav-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}
.nav.nav-tabs.left-tabs.sideways-tabs .nav-link {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    border-radius: 0 !important;
    letter-spacing: normal !important;
    text-shadow: none !important;
    position: relative;
    z-index: auto;
}

/* --- Consumer info bar (DARMHA control only) --- */
.dmha-info-bar {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    background: linear-gradient(180deg, #ffffff 0%, #f0f6fc 100%);
    border-left: 4px solid #0d3b80;
    border-bottom: 1px solid #d4e2f0;
    padding: 4px 14px 2px 12px;
    margin: 0 0 0 0;
    width: 100%;
    box-sizing: border-box;
    min-height: 0;
}
/* Row 1: consumer name on its own line, larger and bolder */
.dmha-info-bar .consumer-name {
    flex: 0 0 auto;
    width: 100%;
    padding: 0 0 4px 0;
    margin: 0 0 4px 0;
    border-right: none;
    border-bottom: 1px solid #cddcee;
}
.dmha-info-bar .consumer-name,
.dmha-info-bar .consumer-name * {
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 16px !important;
    font-weight: 900 !important;
    color: #0d3b80 !important;
    letter-spacing: 0.2px;
    line-height: 1.25;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    text-transform: none;
}
/* Row 2: meta info (provider | dates) on second line */
.dmha-info-bar .consumer-meta {
    flex: 1 1 auto;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 12px;
    color: #3a5a80;
    line-height: 1.3;
    margin: 0;
    padding: 0;
}
.dmha-info-bar .consumer-meta * { color: #3a5a80; }
.dmha-info-bar .provider-name {
    flex: 0 0 auto;
    width: 100%;
    margin-left: 0;
    padding-left: 0;
    border-left: none;
    padding-top: 2px;
}
.dmha-info-bar .provider-name,
.dmha-info-bar .provider-name * {
    font-family: 'Segoe UI', system-ui, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #506080 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* --- ModuleTabsDARMHA (.darmha-tabs) and all other ModuleTabs*.ascx (.tab-bar):
       sharp tab strip, single row, premium gradient look. Applies to every .tab-bar so
       ModuleTabsCarePlan/Provider/UserManager match ModuleTabsDARMHA visually. --- */
.tab-bar,
.tab-bar.darmha-tabs,
body:has(.darmha-tabs) .tab-bar.darmha-tabs {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 0;
    padding: 8px 10px 0 10px;
    margin: 0;
    background: linear-gradient(180deg, #eef4fb 0%, #dfe9f6 100%);
    border-bottom: 3px solid #154a96;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), 0 2px 4px rgba(13,59,128,0.06);
    font-size: 0;
    line-height: 0;
    overflow-x: auto;
}
.tab-bar > div,
.tab-bar > span,
.tab-bar.darmha-tabs > div,
.tab-bar.darmha-tabs > span {
    display: inline-flex;
    align-items: flex-end;
    margin: 0;
    padding: 0;
}
.tab-bar .Initial,
.tab-bar .Clicked,
.tab-bar input[type="submit"].Initial,
.tab-bar input[type="button"].Initial,
.tab-bar input[type="submit"].Clicked,
.tab-bar input[type="button"].Clicked,
.tab-bar.darmha-tabs .Initial,
.tab-bar.darmha-tabs .Clicked,
.tab-bar.darmha-tabs input[type="submit"].Initial,
.tab-bar.darmha-tabs input[type="button"].Initial,
.tab-bar.darmha-tabs input[type="submit"].Clicked,
.tab-bar.darmha-tabs input[type="button"].Clicked {
    margin: 0 !important;
    font-family: 'Segoe UI', 'Inter', system-ui, sans-serif;
}

/* ============================================================
   GridView on ModuleTabsDARMHA pages (ConsumerEpisodeView etc.)
   Wrapped in a visible card-like border with rounded corners,
   shadow, modern alternating rows, hover effect.
   ============================================================ */
body.has-darmha-tabs table.gv-tabular,
body.has-darmha-tabs table.grid-item,
body.has-darmha-tabs table.gv-tabular.grid-item,
body:has(.darmha-tabs) table.gv-tabular,
body:has(.darmha-tabs) table.grid-item,
body:has(.darmha-tabs) table.gv-tabular.grid-item {
    border: none !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 5px 0 0 !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 5px !important;
    padding: 0 !important;
    overflow: hidden;
    background: #ffffff !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

/* Card body — 3px padding except 10px on the right edge so the gridview has breathing room */
body:has(.darmha-tabs) .card-body,
body:has(.darmha-tabs) .card .card-body,
body.has-darmha-tabs .card-body {
    padding: 3px 10px 3px 3px !important;
    padding-top: 3px !important;
    padding-right: 10px !important;
    padding-bottom: 3px !important;
    padding-left: 3px !important;
    margin: 0 !important;
}

/* Radio button lists — force horizontal layout (Yes / No on same line) */
body:has(.darmha-tabs) [id*="RadioButtonList"] table,
body:has(.darmha-tabs) [id*="RadioButtonList"] tbody,
body.has-darmha-tabs [id*="RadioButtonList"] table,
body.has-darmha-tabs [id*="RadioButtonList"] tbody {
    display: inline-table !important;
    width: auto !important;
}
body:has(.darmha-tabs) [id*="RadioButtonList"] tr,
body.has-darmha-tabs [id*="RadioButtonList"] tr {
    display: table-row !important;
}
body:has(.darmha-tabs) [id*="RadioButtonList"] td,
body.has-darmha-tabs [id*="RadioButtonList"] td {
    display: table-cell !important;
    white-space: nowrap !important;
    padding-right: 10px !important;
    vertical-align: middle !important;
}
body:has(.darmha-tabs) [id*="RadioButtonList"] input[type="radio"],
body.has-darmha-tabs [id*="RadioButtonList"] input[type="radio"] {
    margin-right: 4px !important;
    vertical-align: middle !important;
}
body:has(.darmha-tabs) [id*="RadioButtonList"] label,
body.has-darmha-tabs [id*="RadioButtonList"] label {
    display: inline !important;
    vertical-align: middle !important;
    margin-right: 6px !important;
}

/* Module pages — labels and RadioButtonLists must sit on the SAME row and be vertically centered.
   Targets form cells (td), flex rows, and the radio wrappers. */
body:has(.darmha-tabs) form td,
body:has(.darmha-tabs) [id*="div_Form"] table tr > td,
body:has(.darmha-tabs) .card-body table tr > td,
body.has-darmha-tabs form td,
body.has-darmha-tabs [id*="div_Form"] table tr > td,
body.has-darmha-tabs .card-body table tr > td {
    vertical-align: middle !important;
}
body:has(.darmha-tabs) .flexRow,
body:has(.darmha-tabs) .flexRow20,
body:has(.darmha-tabs) .flexRow24,
body.has-darmha-tabs .flexRow,
body.has-darmha-tabs .flexRow20,
body.has-darmha-tabs .flexRow24 {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}
body:has(.darmha-tabs) .flexRow > *,
body:has(.darmha-tabs) .flexRow20 > *,
body:has(.darmha-tabs) .flexRow24 > *,
body.has-darmha-tabs .flexRow > *,
body.has-darmha-tabs .flexRow20 > *,
body.has-darmha-tabs .flexRow24 > * {
    align-self: center !important;
}
/* SkinID="lblStandard" / asp:Label spans + the radio wrappers — inline + vertically centered */
body:has(.darmha-tabs) td > span[id*="Label"],
body:has(.darmha-tabs) td > label,
body:has(.darmha-tabs) td > span[id*="RadioButtonList"],
body:has(.darmha-tabs) td > .xrbl,
body.has-darmha-tabs td > span[id*="Label"],
body.has-darmha-tabs td > label,
body.has-darmha-tabs td > span[id*="RadioButtonList"],
body.has-darmha-tabs td > .xrbl {
    display: inline-block !important;
    vertical-align: middle !important;
}

/* Flow-layout RadioButtonList (RepeatLayout="Flow") — keep items on one row, no wrap */
.xrbl,
span.xrbl,
body:has(.darmha-tabs) span[id*="RadioButtonList"].xrbl,
body:has(.darmha-tabs) span[id*="RadioButtonList"]:not(:has(table)),
body.has-darmha-tabs span[id*="RadioButtonList"].xrbl,
body.has-darmha-tabs span[id*="RadioButtonList"]:not(:has(table)) {
    white-space: nowrap !important;
    display: inline-block !important;
}
.xrbl input[type="radio"],
span[id*="RadioButtonList"] input[type="radio"] {
    margin-right: 4px !important;
    vertical-align: middle !important;
}
.xrbl label,
span[id*="RadioButtonList"] > label {
    display: inline !important;
    white-space: nowrap !important;
    margin-right: 12px !important;
    vertical-align: middle !important;
}

/* Right-side panel (Additional Episode Details, Funding Support) — visible border + 5px padding */
body:has(.darmha-tabs) .WizardStepStyle td:nth-child(2),
body:has(.darmha-tabs) .WizardStepStyle td.right-panel,
body:has(.darmha-tabs) table[id$="WizardMain"] td:nth-child(2) > div,
body.has-darmha-tabs .WizardStepStyle td:nth-child(2) {
    border: 1px solid #c8d8ec !important;
    padding: 5px !important;
    border-radius: 4px !important;
    background: #ffffff !important;
}

/* Section header — "View Episode" / "Edit Episode" / "New ..." etc — bold + left-justified + single line */
body:has(.darmha-tabs) h5,
body:has(.darmha-tabs) h5.h5,
body:has(.darmha-tabs) [id$="_LabelHeader"],
body:has(.darmha-tabs) [id$="_labelHeader"],
body:has(.darmha-tabs) [id$="_LabelMode"],
body.has-darmha-tabs h5,
body.has-darmha-tabs h5.h5,
body.has-darmha-tabs [id$="_LabelHeader"],
body.has-darmha-tabs [id$="_labelHeader"],
body.has-darmha-tabs [id$="_LabelMode"] {
    font-weight: 800 !important;
    font-size: 14px !important;
    color: #0d3b80 !important;
    text-align: left !important;
    white-space: nowrap !important;
}
body:has(.darmha-tabs) h5:has([id$="_LabelHeader"]),
body:has(.darmha-tabs) h5:has([id$="_labelHeader"]),
body:has(.darmha-tabs) h5:has([id$="_LabelMode"]),
body:has(.darmha-tabs) h1:has([id$="_LabelMode"]),
body:has(.darmha-tabs) .h4:has([id$="_LabelMode"]),
body.has-darmha-tabs h5:has([id$="_LabelHeader"]),
body.has-darmha-tabs h5:has([id$="_labelHeader"]),
body.has-darmha-tabs h5:has([id$="_LabelMode"]),
body.has-darmha-tabs h1:has([id$="_LabelMode"]),
body.has-darmha-tabs .h4:has([id$="_LabelMode"]) {
    text-align: left !important;
}

/* "Last Update On" / "Created On" datetime stamp on module pages — right-justified at the top of the card */
body:has(.darmha-tabs) [id$="_LabelDateTimeStamp"],
body:has(.darmha-tabs) [id$="LabelDateTimeStamp"],
body:has(.darmha-tabs) [id$="_div_LabelDateTimeStamp"],
body:has(.darmha-tabs) [id$="div_LabelDateTimeStamp"],
body.has-darmha-tabs [id$="_LabelDateTimeStamp"],
body.has-darmha-tabs [id$="LabelDateTimeStamp"],
body.has-darmha-tabs [id$="_div_LabelDateTimeStamp"],
body.has-darmha-tabs [id$="div_LabelDateTimeStamp"] {
    text-align: right !important;
    display: block !important;
    white-space: nowrap !important;
}
body:has(.darmha-tabs) td:has(> [id$="LabelDateTimeStamp"]),
body:has(.darmha-tabs) td:has(> div > [id$="LabelDateTimeStamp"]),
body:has(.darmha-tabs) td:has(> [id$="div_LabelDateTimeStamp"]),
body:has(.darmha-tabs) div:has(> [id$="LabelDateTimeStamp"]),
body.has-darmha-tabs td:has(> [id$="LabelDateTimeStamp"]),
body.has-darmha-tabs td:has(> div > [id$="LabelDateTimeStamp"]),
body.has-darmha-tabs td:has(> [id$="div_LabelDateTimeStamp"]),
body.has-darmha-tabs div:has(> [id$="LabelDateTimeStamp"]) {
    text-align: right !important;
    width: 100% !important;
    vertical-align: top !important;
    padding-right: 10px !important;
}

/* "Last Update on …" / any date label on the right side — right-justified */
body:has(.darmha-tabs) [id*="LabelLastUpdate"],
body:has(.darmha-tabs) [id*="lblLastUpdate"],
body:has(.darmha-tabs) [id*="Last_Update"],
body:has(.darmha-tabs) .last-update,
body.has-darmha-tabs [id*="LabelLastUpdate"],
body.has-darmha-tabs [id*="lblLastUpdate"],
body.has-darmha-tabs [id*="Last_Update"],
body.has-darmha-tabs .last-update {
    text-align: right !important;
    display: inline-block !important;
    float: right !important;
    font-style: italic !important;
    color: #506080 !important;
    font-size: 12px !important;
}
/* Outer card — maintains a tall, consistent height regardless of content.
   Locks to calc(100vh - 100px) with all height properties so it stays the same
   even when the gridview has few rows. */
html body:has(.darmha-tabs) .card.menu_border_shadow,
html body.has-darmha-tabs .card.menu_border_shadow,
html body:has(.darmha-tabs) div.card.menu_border_shadow,
html body.has-darmha-tabs div.card.menu_border_shadow {
    padding: 0 5px 0 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    display: block !important;
}
/* Cell wrapping the card (Site.Master's .dmha-main-col TD) — let card define height */
html body:has(.darmha-tabs) td.dmha-main-col,
html body.has-darmha-tabs td.dmha-main-col {
    vertical-align: top !important;
    height: auto !important;
}
/* Card-body inside the outer card — flex grow so it fills the card */
html body:has(.darmha-tabs) .card.menu_border_shadow > .card-body,
html body.has-darmha-tabs .card.menu_border_shadow > .card-body {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    min-height: 0 !important;
}
/* Inner white card — stretch to match the outer's height */
body:has(.darmha-tabs) .card.menu_border_shadow .card,
body:has(.darmha-tabs) .card.menu_border_shadow .card-body .card,
body.has-darmha-tabs .card.menu_border_shadow .card,
body.has-darmha-tabs .card.menu_border_shadow .card-body .card {
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}
body:has(.darmha-tabs) .card.menu_border_shadow .card > .card-body,
body.has-darmha-tabs .card.menu_border_shadow .card > .card-body {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
}

/* Last column - no right border */
body:has(.darmha-tabs) table.gv-tabular > tbody > tr > td:last-child,
body:has(.darmha-tabs) table.grid-item > tbody > tr > td:last-child,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th:last-child,
body:has(.darmha-tabs) table.grid-item > tbody > tr:first-child > th:last-child {
    border-right: none !important;
}

/* Header — flat light grey, left-justified, minimalist */
body.has-darmha-tabs table.gv-tabular > tbody > tr:first-child > th,
body.has-darmha-tabs table.grid-item > tbody > tr:first-child > th,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th,
body:has(.darmha-tabs) table.grid-item > tbody > tr:first-child > th {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    color: #1e3a5f !important;
    text-shadow: none !important;
    padding: 10px 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border: none !important;
    border-top: none !important;
    border-bottom: 4px solid #1a5cb5 !important;
    border-right: none !important;
    box-shadow: none !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    text-overflow: clip !important;
    line-height: 1.25 !important;
    vertical-align: middle !important;
    text-align: left !important;
    position: static !important;
    box-sizing: border-box !important;
}

/* Checkbox columns — center header label */
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th.col-bool,
body:has(.darmha-tabs) table.grid-item > tbody > tr:first-child > th.col-bool,
body.has-darmha-tabs table.gv-tabular > tbody > tr:first-child > th.col-bool,
body.has-darmha-tabs table.grid-item > tbody > tr:first-child > th.col-bool {
    text-align: center !important;
}
body.has-darmha-tabs table.gv-tabular > tbody > tr:first-child > th a,
body.has-darmha-tabs table.grid-item > tbody > tr:first-child > th a,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th a,
body:has(.darmha-tabs) table.grid-item > tbody > tr:first-child > th a {
    color: #1e3a5f !important;
    text-shadow: none !important;
}
/* Header text/labels inside th — prevent stacking/overflow */
body.has-darmha-tabs table.gv-tabular > tbody > tr:first-child > th *,
body.has-darmha-tabs table.grid-item > tbody > tr:first-child > th *,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:first-child > th *,
body:has(.darmha-tabs) table.grid-item > tbody > tr:first-child > th * {
    position: static !important;
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1.25 !important;
}

/* Body cells — vertical padding only, no horizontal */
body.has-darmha-tabs table.gv-tabular > tbody > tr > td,
body.has-darmha-tabs table.grid-item > tbody > tr > td,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr > td,
body:has(.darmha-tabs) table.grid-item > tbody > tr > td {
    padding: 10px 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-bottom: 1px solid #e2eaf4 !important;
    font-size: 13px !important;
}

/* Last row — no border-bottom (rounded corner clean cut) */
body.has-darmha-tabs table.gv-tabular > tbody > tr:last-child > td,
body.has-darmha-tabs table.grid-item > tbody > tr:last-child > td,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:last-child > td,
body:has(.darmha-tabs) table.grid-item > tbody > tr:last-child > td {
    border-bottom: none !important;
}

/* Alternating rows */
body.has-darmha-tabs table.gv-tabular > tbody > tr:nth-child(odd) > td,
body.has-darmha-tabs table.grid-item > tbody > tr:nth-child(odd) > td,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:nth-child(odd) > td,
body:has(.darmha-tabs) table.grid-item > tbody > tr:nth-child(odd) > td {
    background: #ffffff !important;
}
body.has-darmha-tabs table.gv-tabular > tbody > tr:nth-child(even) > td,
body.has-darmha-tabs table.grid-item > tbody > tr:nth-child(even) > td,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:nth-child(even) > td,
body:has(.darmha-tabs) table.grid-item > tbody > tr:nth-child(even) > td {
    background: linear-gradient(180deg, #f4f9ff 0%, #e9f2fc 100%) !important;
}

/* Hover */
body.has-darmha-tabs table.gv-tabular > tbody > tr:hover > td,
body.has-darmha-tabs table.grid-item > tbody > tr:hover > td,
body:has(.darmha-tabs) table.gv-tabular > tbody > tr:hover > td,
body:has(.darmha-tabs) table.grid-item > tbody > tr:hover > td {
    background: #dbeafe !important;
    cursor: pointer;
}

/* Inactive tab — slanted right edge (trapezoid) for real-tab look, with thin border */
.tab-bar.darmha-tabs .Initial,
.tab-bar.darmha-tabs input[type="submit"].Initial,
.tab-bar.darmha-tabs input[type="button"].Initial {
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%) !important;
    -webkit-clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%) !important;
    padding: 10px 30px 10px 18px !important;
    border: 1px solid #b8c8de !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #ffffff 0%, #eaf1fa 60%, #d8e3f0 100%) !important;
    color: #34507a !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    letter-spacing: 0.25px !important;
    text-transform: none !important;
    margin: 0 -10px 0 0 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), inset -1px 0 0 #b8c8de !important;
    height: auto !important;
    min-height: 0 !important;
    transition: background 0.18s ease, color 0.18s ease, transform 0.14s ease;
    z-index: 1;
    position: relative;
    top: 0;
    overflow: hidden;
    width: auto !important;
}
.tab-bar.darmha-tabs .Initial::after,
.tab-bar.darmha-tabs input[type="submit"].Initial::after,
.tab-bar.darmha-tabs input[type="button"].Initial::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 0;
    height: 2px;
    background: transparent;
    border-radius: 2px 2px 0 0;
    transition: background 0.18s ease;
}
.tab-bar.darmha-tabs .Initial:hover,
.tab-bar.darmha-tabs input[type="submit"].Initial:hover,
.tab-bar.darmha-tabs input[type="button"].Initial:hover {
    background: linear-gradient(180deg, #ffffff 0%, #e9f2fc 100%);
    color: #0d3b80;
    border-color: #7ea7d2 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,1), 0 -3px 10px rgba(26,92,181,0.12), 0 2px 4px rgba(13,59,128,0.06);
    transform: translateY(-1px);
    z-index: 2;
}
.tab-bar.darmha-tabs .Initial:hover::after,
.tab-bar.darmha-tabs input[type="submit"].Initial:hover::after,
.tab-bar.darmha-tabs input[type="button"].Initial:hover::after {
    background: linear-gradient(90deg, transparent 0%, #1a5cb5 50%, transparent 100%);
}
.tab-bar.darmha-tabs .Initial:active,
.tab-bar.darmha-tabs input[type="submit"].Initial:active,
.tab-bar.darmha-tabs input[type="button"].Initial:active {
    transform: translateY(0);
    box-shadow: inset 0 2px 4px rgba(13,59,128,0.08);
}
.tab-bar.darmha-tabs .Initial[disabled],
.tab-bar.darmha-tabs .Initial:hover[disabled] {
    background: #f0f4f8;
    color: #b0bcc8;
    border-color: #dce8f0 !important;
    cursor: default;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

/* Active tab — slanted right edge (trapezoid), deep gradient */
.tab-bar.darmha-tabs .Clicked,
.tab-bar.darmha-tabs input[type="submit"].Clicked,
.tab-bar.darmha-tabs input[type="button"].Clicked {
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%) !important;
    -webkit-clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 0 100%) !important;
    padding: 11px 32px 11px 20px !important;
    border: none !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #5aabe6 0%, #2979c8 30%, #1a5cb5 65%, #0a2e5e 100%) !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    text-transform: none !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.4) !important;
    margin: 0 -10px 0 0 !important;
    height: auto !important;
    min-height: 0 !important;
    width: auto !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.50),
        0 -4px 0 0 #f5a623 inset,
        0 6px 12px rgba(13,59,128,0.30);
    z-index: 5;
    cursor: default;
    position: relative;
    top: 0;
}
.tab-bar.darmha-tabs .Clicked::before,
.tab-bar.darmha-tabs input[type="submit"].Clicked::before,
.tab-bar.darmha-tabs input[type="button"].Clicked::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0) 50%);
    pointer-events: none;
}

/* Center + tight horizontal spacing between bottom action buttons on ModuleTabsDARMHA pages.
   Buttons moved lower with single-space gap. No border on the right edge of the row. */
body:has(.darmha-tabs) div:has(> input.button-6),
body:has(.darmha-tabs) td:has(> input.button-6) {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 4px !important;
    text-align: center !important;
    margin-top: 36px !important;
    margin-bottom: 20px !important;
    padding-top: 20px !important;
    padding-bottom: 12px !important;
    border: none !important;
    border-right: none !important;
}
body:has(.darmha-tabs) div:has(> input.button-6) > input.button-6:last-child,
body:has(.darmha-tabs) td:has(> input.button-6) > input.button-6:last-child {
    border-right: none !important;
}
body:has(.darmha-tabs) div:has(> input.button-6) > input.button-6,
body:has(.darmha-tabs) td:has(> input.button-6) > input.button-6 {
    margin: 0 !important;
}

/* ============================================================
   AMHH / BPHC Care Plan — ModuleTabsCarePlan + WizardMain
   Top tabs: very light borders | Left steps: dark blue rail
   Content: very light blue (matches textbox panel blocks)
   ============================================================ */
/* Card shell is flat (see SiteMaster.css .dmha-module-tabs-card); canvas stays light blue */
.dmha-module-tabs-card > .card-body,
.dmha-module-tabs-card .card-body {
    background: #f4f9fe !important;
}

/* Top tab strip — soft borders only */
.dmha-module-tabs-card .tab-bar.darmha-tabs {
    background: #f4f9fe !important;
    border: 1px solid #e8eef6 !important;
    border-bottom: 1px solid #dce8f4 !important;
    box-shadow: none !important;
}

.dmha-module-tabs-card .tab-bar.darmha-tabs .Initial,
.dmha-module-tabs-card .tab-bar.darmha-tabs input[type="submit"].Initial,
.dmha-module-tabs-card .tab-bar.darmha-tabs input[type="button"].Initial {
    padding: 4px 12px 5px 12px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    border: 1px solid #e8eef6 !important;
    border-bottom: 1px solid #e2eaf4 !important;
    background: #ffffff !important;
    color: #4a6080 !important;
    box-shadow: none !important;
}

.dmha-module-tabs-card .tab-bar.darmha-tabs .Initial:hover {
    border-color: #d4e4f0 !important;
    color: #0d3b80 !important;
    background: #fafcfe !important;
}

.dmha-module-tabs-card .tab-bar.darmha-tabs .Clicked,
.dmha-module-tabs-card .tab-bar.darmha-tabs input[type="submit"].Clicked,
.dmha-module-tabs-card .tab-bar.darmha-tabs input[type="button"].Clicked {
    padding: 5px 14px 6px 14px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    border: 1px solid #c5d9ec !important;
    border-bottom-color: #f4f9fe !important;
    background: linear-gradient(180deg, #5a9ad4 0%, #3a84c8 50%, #2979c8 100%) !important;
    box-shadow: 0 1px 4px rgba(13, 59, 128, 0.12) !important;
}

/* Version header + form blocks — same light blue canvas as inputs area */
.dmha-module-tabs-card #tblVersionHeader,
.dmha-module-tabs-card table[id$="tblVersionHeader"] {
    background: #f4f9fe !important;
    background-image: none !important;
    border: 1px solid #e2eaf4 !important;
}

.dmha-module-tabs-card .formview-section,
.dmha-module-tabs-card div[id^="div_"][id*="Section"] {
    background: #ffffff !important;
    border: 1px solid #e2eaf4 !important;
}

/* Wizard — content pane (right) */
.dmha-module-tabs-card table#WizardMain,
.dmha-module-tabs-card table[id$="WizardMain"] {
    background: #f4f9fe !important;
    border-color: #e2eaf4 !important;
}

.dmha-module-tabs-card .WizardStepStyle {
    background: #f4f9fe !important;
    border: 1px solid #e2eaf4 !important;
    border-width: 1px !important;
    vertical-align: top !important;
}

/* Wizard — left step label rail (dark blue) */
.dmha-module-tabs-card table#WizardMain td:first-child,
.dmha-module-tabs-card table[id$="WizardMain"] td:first-child,
.dmha-module-tabs-card table[id*="SideBarList"] td {
    background: #0d3b80 !important;
    border-color: #1e4a8c !important;
    padding: 8px 10px !important;
    vertical-align: top !important;
}

.dmha-module-tabs-card table[id*="SideBarList"] td a,
.dmha-module-tabs-card table[id*="SideBarList"] td span,
.dmha-module-tabs-card table#WizardMain td:first-child a,
.dmha-module-tabs-card table#WizardMain td:first-child span,
.dmha-module-tabs-card table[id$="WizardMain"] td:first-child a,
.dmha-module-tabs-card table[id$="WizardMain"] td:first-child span {
    color: #ffffff !important;
    font-family: 'Segoe UI', system-ui, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
}

.dmha-module-tabs-card table[id*="SideBarList"] td a:hover,
.dmha-module-tabs-card table#WizardMain td:first-child a:hover,
.dmha-module-tabs-card table[id$="WizardMain"] td:first-child a:hover {
    color: #e3f0ff !important;
    text-decoration: underline !important;
}

/* Current wizard step — lighter blue highlight on rail */
.dmha-module-tabs-card table[id*="SideBarList"] td.aspNet-Wizard-SelectedStepStyle,
.dmha-module-tabs-card table[id*="SideBarList"] td[style*="font-weight: bold"],
.dmha-module-tabs-card table[id*="SideBarList"] td[style*="font-weight:bold"] {
    background: #1a5cb5 !important;
}

/* Inputs stay white on the light-blue canvas */
.dmha-module-tabs-card input[type="text"],
.dmha-module-tabs-card input[type="password"],
.dmha-module-tabs-card textarea,
.dmha-module-tabs-card select {
    background-color: #ffffff !important;
    border-color: #c0cfe4 !important;
}

/* Module pages — card-body content aligns to the bottom and grows upward
   (justify-content:flex-end). Any empty space sits at the top of the card. */
body:has(.darmha-tabs) .card.menu_border_shadow > .card-body,
body.has-darmha-tabs .card.menu_border_shadow > .card-body {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

/* Module pages — every card and wrapper below the consumer-info bar
   (.dmha-info-bar) is flush-left so its left edge matches the info bar. */
body:has(.darmha-tabs) .card.menu_border_shadow,
body:has(.darmha-tabs) .card.menu_border_shadow > .card-body,
body:has(.darmha-tabs) .card.card-body,
body:has(.darmha-tabs) [id*="div_Form"],
body:has(.darmha-tabs) .dmha-info-bar ~ *,
body.has-darmha-tabs .card.menu_border_shadow,
body.has-darmha-tabs .card.menu_border_shadow > .card-body,
body.has-darmha-tabs .card.card-body,
body.has-darmha-tabs [id*="div_Form"],
body.has-darmha-tabs .dmha-info-bar ~ * {
    margin-left: 0 !important;
}

/* ===== Module pages (not BPHC/AMHH CarePlan) =====
   - Disabled/readonly textboxes flush with the form: full width, no border,
     transparent so they inherit the parent's background color.
   - Inner cards with explicit background-color must span the full width of
     their parent and be flush-attached at the top (no extra margin/padding). */
body:has(.darmha-tabs) input[type="text"]:disabled,
body:has(.darmha-tabs) input[type="text"][readonly],
body:has(.darmha-tabs) textarea:disabled,
body:has(.darmha-tabs) textarea[readonly],
body.has-darmha-tabs input[type="text"]:disabled,
body.has-darmha-tabs input[type="text"][readonly],
body.has-darmha-tabs textarea:disabled,
body.has-darmha-tabs textarea[readonly] {
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    padding-left: 0 !important;
}

body:has(.darmha-tabs) .card-body > .card,
body:has(.darmha-tabs) .card-body > .card.card-body,
body:has(.darmha-tabs) .card.card-body > .card,
body:has(.darmha-tabs) [id*="div_Form"] > .card,
body:has(.darmha-tabs) [id*="div_Form"] > .card.card-body,
body.has-darmha-tabs .card-body > .card,
body.has-darmha-tabs .card-body > .card.card-body,
body.has-darmha-tabs .card.card-body > .card,
body.has-darmha-tabs [id*="div_Form"] > .card,
body.has-darmha-tabs [id*="div_Form"] > .card.card-body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
}
