/* =============================================================================================================
   mh-darkfix.css - DARKFIX13 (3 Oct 2026, training note 55). LOADED LAST. Dark mode only - nothing here touches light mode.
   Owner: "check the dark mode ... completely investigate the dark mode and check each Icons buttons fields interface they must
   be clean and clear ... we never checked this, check from both side staff and admins".
   HOW IT WAS FOUND: every visible text, icon and field on 13 screens was measured in dark mode (its colour against the colour
   actually behind it, WCAG contrast: 4.5 for small text, 3 for large/bold text and icons). Each rule below is one measured
   failure, with the number it had. The common cause: colours written for the light theme that never change in dark mode -
   chiefly --mh-slate (#34454D, "dark text / headings only"), which stays dark on a dark page.
   ============================================================================================================= */

/* ---- --mh-slate used as TEXT (measured 1.74 on Teams: "Away", "Set a status", the empty conversation text) ---- */
body.dark .tm-page .tm-me-status,
body.dark .tm-page .tm-me-statusadd,
body.dark .tm-page .tm-empty p,
body.dark .tm-page .tm-gdabout,
body.dark .tm-uprof .tm-upstatus,
body.dark .tm-uprof .tm-uprow,
body.dark .pf-fld > label,
body.dark #view-settings .set-item,
body.dark .mh-app .bm-tag.bm-programs,
body.dark .mh-app .pl-agenda-day,
body.dark .mh-app .pl-sec-divider,
body.dark .mh-app .pg-stub h3,
body.dark .mh-app .wd-card h4,
body.dark .mh-app .att-hh-name,
body.dark .mh-app .cal__nav button,
body.dark .mh-app .pl-nav button,
body.dark .mh-app .att-nav > button,
body.dark .mh-app .pl-x { color: #D3E0DB; }
body.dark .tm-page .tm-me-statusadd svg { color: #D3E0DB; }

/* ---- Case Notes (its own palette, light-only): heading 2.2, CLIENT / HOUSEHOLD tag 2.52, filters 3.86, Confidential 2.98 ---- */
body.dark .mh-app .cn-tl .tb h2 { color: #A9BCB6; }
body.dark .mh-app .cn-tl .kd,
body.dark #mhDetail .cnx .dg .kd, body.dark .mh-app .cnx .dg .kd { background: rgba(143, 209, 180, .14); color: #9FD8BE; }
body.dark .mh-app .cn-tl .fl button { color: #B5C4BF; }
body.dark .mh-app .cn-tl .fl button:hover { background: rgba(255, 255, 255, .06); }
body.dark .mh-app .cn-tl .fl button i { background: rgba(255, 255, 255, .10); color: #D3E0DB; }
body.dark .mh-app .cn-tl .tg.red { background: rgba(229, 138, 128, .14); color: #F0A39A; }

/* ---- Planner: the count on a side tab (2.18) ---- */
body.dark .mh-app .pl-tab .tagn { background: rgba(233, 184, 102, .18); color: #EBC07A; }

/* ---- Reports "coming soon" card icon (1.51) ---- */
body.dark .cs-ic { background: rgba(159, 199, 186, .12); color: #9FC7BA; }

/* ---- the country filter's tick on a dark menu (2.14) - out-ranks the component's own scoped rule ---- */
body.dark .menu .item .tick { color: #9FC7BA; }

/* ---- Help Center: "Open Guide" on each card (3.67) - the card's own accent, lifted ---- */
body.dark .mh-app .hlp-card-go { color: color-mix(in srgb, var(--a, #4E7C72) 50%, #ffffff); }

/* ---- Home: the Recent Families column heads (3.52 at 10px) ---- */
body.dark .mh-app .mh-fs .fam-head span { color: #93A6A0; }

/* ---- Case Notes "Open Note" arrow (owner, 3 Oct: "in dark mode those Open Note arrow icon is gray"; measured 1.32): the circle
   was the light-glass fill on a pale arrow. Now a pine-glass circle with a clear arrow; on hover it fills, as in light mode. ---- */
body.dark .mh-app .cn-tl .op i { background: rgba(159, 199, 186, .14); border-color: rgba(159, 199, 186, .5); color: #DCEFE6; }
body.dark .mh-app .cn-tl .c:hover .op i { background: #9FC7BA; border-color: #9FC7BA; color: #12201C; }
body.dark .mh-app .cn-tl .c:hover .op:disabled i { background: rgba(159, 199, 186, .14); border-color: rgba(159, 199, 186, .5); color: #DCEFE6; }

/* ---- Records (household, client, settings, help tiles): the field LABEL (3.97 at 10px) and "Not set" (3.06) were too faint on the
   dark tile - lifted to the same family of greys, still quieter than the values themselves. ---- */
body.dark #mhDetail .mint-lb, body.dark #hhDetail .mint-lb, body.dark #view-settings .mint-lb, body.dark #view-help .mint-lb,
body.dark .mint-kit .mint-lb { color: #A9B6BF; }
body.dark #mhDetail .mint-vl.un, body.dark #hhDetail .mint-vl.un, body.dark #view-settings .mint-vl.un, body.dark #view-help .mint-vl.un,
body.dark .mint-kit .mint-vl.un { color: #97A6B0; }

/* =============================================================================================================
   CASE NOTES WINDOW + NOTE CARDS (.cnx / #cnPop) - they had NO dark mode at all: the note cards and the open note stayed white
   paper with pale greys (measured 2.1-2.9), and once the paper was made dark, the designer's fixed dark inks (#1C2A25 ...)
   were invisible (1.04). 1) the window's own colour tokens get dark values (its glass reads --tg-rgb, so it turns dark too);
   2) the #cnPop rules that out-rank everything get their own dark lines; 3) every fixed dark ink in mh-casenotes.css that had
   no dark rule is lifted - same hue, light (generated from the stylesheet and measured, 3 Oct; "was" = the light colour).
   ============================================================================================================= */
body.dark #mhDetail .cnx, body.dark .mh-app .cnx {
  --ink: #E4EEEA; --mut: #B3C2BD; --dim: #9DAEA8; --faint: #8D9D97; --line: rgba(255, 255, 255, .10);
  --pine2: #9FD8BE; --red: #F0A39A; --amber: #E9B866; --tg-rgb: 34, 44, 40; --tg-cream2: rgb(28, 37, 34); --tg-k: 1;
}
body.dark .mh-app .cnx .ix, body.dark #mhDetail .cnx .ix { border-color: rgba(255, 255, 255, .10); box-shadow: 0 12px 26px -20px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .06); }
body.dark .mh-app .cnx .dg, body.dark #mhDetail .cnx .dg { border-color: rgba(255, 255, 255, .12); box-shadow: 0 60px 110px -44px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255, 255, 255, .06); }
body.dark .mh-app .cnx .dg .side, body.dark #mhDetail .cnx .dg .side { background: linear-gradient(180deg, rgba(34, 44, 40, .62), rgba(26, 34, 31, .55)); }
body.dark .mh-app .cnx .ix p, body.dark #mhDetail .cnx .ix p { background-image: repeating-linear-gradient(180deg, transparent 0 24px, rgba(255, 255, 255, .05) 24px 25px); }
body.dark #cnPop .mint-vl { color: #E4EEEA; }
body.dark #cnPop .mint-vl.un { color: #97A6B0; }
body.dark #cnPop .mint-lb { color: #A9B6BF; }
body.dark #cnPop .set-desc { color: #B3C2BD; }
body.dark #cnPop .sf b, body.dark #cnPop .sf .big { color: #E4EEEA; }
body.dark #cnPop .lnk { color: #9FD8BE; }
body.dark #cnPop :is(.ft, .sfoot) .ui-btn.secondary, body.dark #cnPop .ft #dmore { color: #DCEFE6; background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .16); }
body.dark .mh-app .cn-tl .fg.over { color: #DFA19B; }   /* light: #B4453A */
body.dark .mh-app .cn-tl .fg.due { color: #E1C498; }   /* light: #8F6220 */
body.dark .mh-app .cn-tl .tg.amber { color: #E1C498; }   /* light: #8F6220 */
body.dark .mh-app .cn-tl .tg.green { color: #A3D7C5; }   /* light: #2F6B57 */
body.dark .mh-app .cn-tl .mt .over { color: #DFA19B; }   /* light: #B4453A */
body.dark .mh-app .cn-tl .mt .due { color: #E1C498; }   /* light: #8F6220 */
body.dark #mhDetail .cnx .ix .f b { color: #C5D3CE; }   /* light: #26332E */
body.dark .mh-app .cnx .ix .f b { color: #C5D3CE; }   /* light: #26332E */
body.dark #mhDetail .cnx .cn-pill.plum { color: #D2A8BF; }   /* light: #8E4A70 */
body.dark .mh-app .cnx .cn-pill.plum { color: #D2A8BF; }   /* light: #8E4A70 */
body.dark #mhDetail .cnx .cn-pill.slate { color: #C4CED4; }   /* light: #43535D */
body.dark .mh-app .cnx .cn-pill.slate { color: #C4CED4; }   /* light: #43535D */
body.dark #mhDetail .cnx .dg.conf .state .ico { color: #C4CED4; }   /* light: #43535D */
body.dark .mh-app .cnx .dg.conf .state .ico { color: #C4CED4; }   /* light: #43535D */
body.dark #mhDetail .cnx .dg.conf .state .tx b { color: #C4CED4; }   /* light: #43535D */
body.dark .mh-app .cnx .dg.conf .state .tx b { color: #C4CED4; }   /* light: #43535D */
body.dark #mhDetail .cnx .dg #dbd p { color: #C8D0CE; }   /* light: #495753 */
body.dark .mh-app .cnx .dg #dbd p { color: #C8D0CE; }   /* light: #495753 */
body.dark #mhDetail .cnx .sf b { color: #C5D3CE; }   /* light: #26332E */
body.dark .mh-app .cnx .sf b { color: #C5D3CE; }   /* light: #26332E */
body.dark #mhDetail .cnx .sf .big { color: #C2D6D0; }   /* light: #20302B */
body.dark .mh-app .cnx .sf .big { color: #C2D6D0; }   /* light: #20302B */
body.dark #mhDetail .cnx .tr2 li { color: #C6D2CE; }   /* light: #3A4A45 */
body.dark .mh-app .cnx .tr2 li { color: #C6D2CE; }   /* light: #3A4A45 */
body.dark #mhDetail .cnx .rs .rw b { color: #C5D3CE; }   /* light: #26332E */
body.dark .mh-app .cnx .rs .rw b { color: #C5D3CE; }   /* light: #26332E */
body.dark #mhDetail .cnx .rs.conf .stmp { color: #D2A8BF; }   /* light: #8E4A70 */
body.dark .mh-app .cnx .rs.conf .stmp { color: #D2A8BF; }   /* light: #8E4A70 */
body.dark #mhDetail .cnx .bpc .stub b { color: #C5D3CE; }   /* light: #26332E */
body.dark .mh-app .cnx .bpc .stub b { color: #C5D3CE; }   /* light: #26332E */
body.dark #mhDetail .cnx .er .dcol b { color: #C2D6D0; }   /* light: #20302B */
body.dark .mh-app .cnx .er .dcol b { color: #C2D6D0; }   /* light: #20302B */
body.dark #mhDetail .cnx .cn-edwarn { color: #DEAA9B; }   /* light: #7A3A28 */
body.dark .mh-app .cnx .cn-edwarn { color: #DEAA9B; }   /* light: #7A3A28 */
body.dark #mhDetail .cnx .ix p.cn-sglock { color: #D0C3D5; }   /* light: #7A5C86 */
body.dark .mh-app .cnx .ix p.cn-sglock { color: #D0C3D5; }   /* light: #7A5C86 */
body.dark #mhDetail .cnx .ix p.cn-sglock svg { color: #D2A8BF; }   /* light: #8E4A70 */
body.dark .mh-app .cnx .ix p.cn-sglock svg { color: #D2A8BF; }   /* light: #8E4A70 */

/* ---- FORMS AND WIZARDS (the shared field kit - every sheet and wizard): measured on the New Event sheet and the user record ---- */
body.dark .mint-w > .mint-lb { color: #A9B6BF; }                                  /* field label 3.36 */
body.dark .mint-w > .mint-vl.un { color: #97A6B0; }                               /* "Not set" 3.06 */
body.dark .mint-lb .mint-req { color: #F28B82; }                                  /* the required star 1.95 */
body.dark .acc-c svg, body.dark .acc-c { color: #9FD8BE; }                         /* a section's open/close arrow 2.43 */
body.dark .mhcombo-trigger .mhcombo-val.ph { color: #9AA9B3; }                    /* a dropdown's placeholder 3.52 */
body.dark .mh-app .ecs-tabs > button.on { color: #EAF5F0; }                       /* the chosen tab on a sheet 3.62 */
body.dark .fh-tx .fh-sub, body.dark #mhDetail .m-foot .foot-hint .fh-sub { color: #9AABB6; }   /* the footer hint under a record 3.02 */

/* ---- MAIL: "Important" 1.72; dates, previews, record codes, "To:" 3.2-3.9 ---- */
body.dark .ml-pill.imp { background: rgba(233, 184, 102, .16); color: #EBC07A; }
body.dark .ml-pill.imp svg { color: #EBC07A; }
body.dark :is(.ml-when, .ml-snip, .ml-phn, .ml-rec-k, .ml-mto span) { color: #A9B6BF; }

/* ---- TEAMS: "2 members" under a group's name 2.65 ---- */
body.dark .tm-chmeta .tm-cstatus { color: #93C7B4; }

/* ---- THE ASSISTANT: "Report" on a search result 3.08 ---- */
body.dark .as-rec .as-rec-go { color: #9FC7BA; }

/* ---- "COMING SOON" on a page still being built (Documents, Audit) 2.87 ---- */
body.dark .mh-app .stub .badge-soon { color: #EDB08F; }

/* ---- empty pickers on forms ("Select a date", "Select a relationship") 2.87 - still quieter than a value, now readable ---- */
body.dark .dp-field .dpf-val.empty, body.dark .mhsel-btn .mhsel-val.ph { color: rgba(176, 196, 202, .78); }


/* ---- ASSIST16: the Assistant's "LIVE > CLIENTS" source label on a live answer, 2.87 (measured 3 Oct, as Brooke) ---- */
body.dark .as-live .as-src, body.dark .as-card .as-src { color: #7FC4A3; }
body.dark .as-card .as-src span { color: rgba(176, 196, 202, .78); }