/* ============================================================================
   CLIENT DESKTOP — BLUE THEME (parent accounts) — 2026-07-30
   Re-skins the DESKTOP parent dashboard from the emerald parent-rail theme to
   the loader's Apple-blue, mirroring the mobile o4 blue. Scoped html.pm-app-o4
   (== a parent/adult family account; a CHILD dashboard never gets it) and
   wrapped @media (min-width:761px) so MOBILE (client-mobile.css, <=760px) is
   untouched. Load AFTER parent-rail.css. Fully reversible: drop the <link>.

   Structure:
     1. BACKBONE — every green color declaration in parent-rail.css, auto-
        transformed to blue one specificity-class higher (html.pm-app-o4 …).
        Only color declarations are copied; layout is never touched, so a miss
        can at worst leave something green, never break a layout.
     2. REFINEMENTS — hand-tuned loader-blue values (from the desktop-blue
        audit) that win over the mechanical backbone: the skinny .18 card
        border, the mobile-matched rail gradient, the top bar, the avatar,
        the shared card-title accent bar, the calendar today cell, etc.
     3. NON-PARENT-RAIL greens — inline dashboard/component styles the backbone
        can't reach: the "LIVE" pill, the hours progress bar, the done-task
        checkbox, the homework "done" chip, the Attended stat dot + chart bar.
   ============================================================================ */
@media (min-width:761px) {

/* ── 1. BACKBONE (auto-transformed parent-rail.css greens → blue) ─────────── */
  html.pm-app-o4 body.pm-parent-rail {
    /* Phase 40k — flipped vertically (0deg): brighter blue at the TOP, deep navy
       at the BOTTOM (was navy-top / bright-bottom). */
    --pmkid-nav-grad: linear-gradient(0deg, #0b3d6b 0%, #007aff 52%, #0a84ff 100%);
    --pmkid-purple-deep:   #0b3d6b;
    --pmkid-purple-bright: #007aff;
    --pmkid-purple-soft:   #0a84ff;
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item__icon,
  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item:hover {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item:hover {
    color: #0b3d6b;
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item.is-active {
    background: linear-gradient(135deg, #007aff 0%, #0a84ff 100%);
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-nav {
    box-shadow:
      6px 0 34px -14px rgba(0, 122, 255, .55),
      inset -1px 0 0 rgba(255, 255, 255, .10);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-card,
  html.pm-app-o4 body.pm-parent-rail .nx-stats,
  html.pm-app-o4 body.pm-parent-rail #nxStatsCard,
  html.pm-app-o4 body.pm-parent-rail #nxNotifStrip .nx-notif-trigger {
    border: 1.5px solid rgba(0, 96, 223, .40) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf {
    --pmpf-trim: #7fbdff;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar {
    background: linear-gradient(120deg, #0b3d6b 0%, #007aff 55%, #0a84ff 100%) !important;
    border-bottom: 1px solid rgba(11, 61, 107, .55) !important;
    box-shadow: 0 10px 24px -14px rgba(11, 61, 107, .65), inset 0 1px 0 rgba(255, 255, 255, .18) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar .nx-search input {
    box-shadow: inset 0 1px 2px rgba(11, 61, 107, .25) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar .nx-userpod__avatar {
    background: linear-gradient(135deg, #007aff 0%, #0a84ff 100%) !important;
    box-shadow: 0 2px 6px -1px rgba(11, 61, 107, .5) !important;
  }

  /* Phase 40cc.10 — the whole search experience now follows the CHOSEN theme
     (--kt-* tokens; blue = fallback), matching the Phase 40z brand convention.
     Was hardcoded O4 blue, so on a rose/purple/etc theme the search stayed blue. */
  html.pm-app-o4 body.pm-parent-rail .ms-panel {
    border: 1px solid color-mix(in srgb, var(--kt-accent-deep, #0060df) 32%, transparent);
    box-shadow:
      0 24px 64px -16px color-mix(in srgb, var(--kt-chrome-deep, #0b3d6b) 38%, transparent),
      0 4px 18px -6px color-mix(in srgb, var(--kt-accent-ink, #007aff) 22%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-panel::before {
    background: var(--kt-topbar-grad, linear-gradient(90deg, #0b3d6b 0%, #0a84ff 55%, #7fbdff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-summary {
    background: linear-gradient(180deg, var(--kt-accent-soft-bg, #f4f8ff) 0%, #ffffff 100%);
    border-bottom: 1px solid color-mix(in srgb, var(--kt-accent-deep, #0060df) 14%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-browse-head {
    background: linear-gradient(180deg, var(--kt-accent-soft-bg, #f4f8ff) 0%, #ffffff 100%);
    border-bottom: 1px solid color-mix(in srgb, var(--kt-accent-deep, #0060df) 14%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-browse-title {
    color: var(--kt-accent-deep, #0060df);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-empty-header,
  html.pm-app-o4 body.pm-parent-rail .ms-gallery-grouphead,
  html.pm-app-o4 body.pm-parent-rail .ms-section__head {
    color: var(--kt-accent-deep, #0060df);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card {
    border: 1px solid color-mix(in srgb, var(--kt-accent-ink, #007aff) 18%, #ffffff);
    background: #ffffff;
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card::before {
    background: var(--kt-primary-grad, linear-gradient(135deg, #0a84ff, #007aff, #4aa8ff));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card:hover {
    background: linear-gradient(135deg, var(--kt-accent-soft-bg, #f4f8ff) 0%, color-mix(in srgb, var(--kt-accent-ink, #007aff) 8%, #ffffff) 100%);
    box-shadow:
      0 12px 28px -8px color-mix(in srgb, var(--kt-accent-ink, #007aff) 34%, transparent),
      0 2px 8px -2px color-mix(in srgb, var(--kt-accent-deep, #0060df) 18%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card:hover .ms-gallery-card__icon {
    color: var(--kt-accent-bright, #0a84ff);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card .ms-spark {
    background: radial-gradient(circle, #FFFFFF 0%, color-mix(in srgb, var(--kt-accent-ink, #007aff) 30%, #ffffff) 60%, transparent 100%);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-gallery-card__hint {
    color: color-mix(in srgb, var(--kt-accent-deep, #0060df) 50%, #94a3b8);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-chip:hover {
    background: linear-gradient(135deg, var(--kt-accent-soft-bg, #f4f8ff) 0%, color-mix(in srgb, var(--kt-accent-ink, #007aff) 8%, #ffffff) 100%);
    border-color: color-mix(in srgb, var(--kt-accent-ink, #007aff) 30%, #ffffff);
    color: var(--kt-chrome-deep, #0b3d6b);
    box-shadow: 0 4px 10px -4px color-mix(in srgb, var(--kt-accent-ink, #007aff) 25%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-chip.is-active {
    background: var(--kt-topbar-grad, linear-gradient(135deg, #0b3d6b 0%, #007aff 100%));
    box-shadow:
      0 4px 12px -2px color-mix(in srgb, var(--kt-chrome-deep, #0b3d6b) 40%, transparent),
      inset 0 1px 0 rgba(255, 255, 255, .16);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-chip.is-active:hover {
    background: var(--kt-primary-grad, linear-gradient(135deg, #0a84ff 0%, #0a84ff 100%));
    box-shadow: 0 6px 16px -2px color-mix(in srgb, var(--kt-accent-ink, #007aff) 45%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-subchip.is-active {
    background: var(--kt-accent-soft-bg, #eff6ff);
    border-color: color-mix(in srgb, var(--kt-accent-ink, #007aff) 30%, #ffffff);
    color: var(--kt-chrome-deep, #0b3d6b);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-subchip.is-active .ms-chip__n {
    color: var(--kt-chrome-deep, #0b3d6b);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-item::before {
    background: var(--kt-primary-grad, linear-gradient(180deg, #0a84ff 0%, #3d9bff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-item:hover,
  html.pm-app-o4 body.pm-parent-rail .ms-item.is-selected {
    background: linear-gradient(90deg, color-mix(in srgb, var(--kt-accent-ink, #007aff) 7%, transparent) 0%, color-mix(in srgb, var(--kt-accent-deep, #0060df) 3%, transparent) 100%);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-item:hover .ms-item__icon,
  html.pm-app-o4 body.pm-parent-rail .ms-item.is-selected .ms-item__icon {
    color: var(--kt-accent-bright, #0a84ff);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-item:hover .ms-item__title,
  html.pm-app-o4 body.pm-parent-rail .ms-item.is-selected .ms-item__title {
    color: var(--kt-chrome-deep, #0b3d6b);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-item:hover .ms-badge,
  html.pm-app-o4 body.pm-parent-rail .ms-item.is-selected .ms-badge {
    background: linear-gradient(135deg, var(--kt-accent-soft-bg, #eff6ff) 0%, color-mix(in srgb, var(--kt-accent-ink, #007aff) 15%, #ffffff) 100%);
    color: var(--kt-accent-deep, #0060df);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-panel__preview {
    background: #ffffff;
    border-left: 1px solid color-mix(in srgb, var(--kt-accent-deep, #0060df) 16%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-pv__btn--primary {
    background: var(--kt-topbar-grad, linear-gradient(135deg, #0b3d6b 0%, #007aff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-pv__btn--primary:hover {
    background: var(--kt-primary-grad, linear-gradient(135deg, #0a84ff 0%, #0a84ff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-drawer__btn--primary {
    background: var(--kt-topbar-grad, linear-gradient(135deg, #0b3d6b 0%, #007aff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-drawer__btn--primary:hover {
    background: var(--kt-primary-grad, linear-gradient(135deg, #0a84ff 0%, #0a84ff 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .ms-panel__results::-webkit-scrollbar-thumb,
  html.pm-app-o4 body.pm-parent-rail .ms-panel__preview::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--kt-accent-ink, #007aff) 25%, #ffffff);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-panel__results {
    background: linear-gradient(180deg, var(--kt-accent-soft-bg, #f4f8ff) 0%, #ffffff 110px);
  }

  html.pm-app-o4 body.pm-parent-rail .ms-empty-sub {
    color: color-mix(in srgb, var(--kt-accent-deep, #0060df) 55%, #94a3b8);
  }

  html.pm-app-o4 body.pm-parent-rail {
    /* Phase 40z — the parent's brand palette now follows the --kt-* tokens, so
       KPI/chip/icon/link/button accents theme with the rest. Blue = fallback.
       Left literal: alpha washes (no solid token) + the 2 chart series (keep
       data-viz distinct). */
    --primary: var(--kt-accent-ink, #007aff);
    --primary-hover: var(--kt-accent-deep, #0060df);
    --primary-soft: rgba(0, 122, 255, .13);
    --primary-ink: var(--kt-accent-ink, #0060df);
    --action-bg: var(--kt-accent-ink, #007aff);
    --action-bg-hover: var(--kt-accent-deep, #0060df);
    --blue-soft: var(--kt-accent-soft-bg, #dbeafe);
    --blue-ink: var(--kt-accent-ink, #0060df);
    --indigo-soft: var(--kt-accent-soft-bg, #dbeafe);
    --indigo-ink: var(--kt-accent-deep, #0b3d6b);
    --icon-blue-bg: var(--kt-accent-soft-bg, #dbeafe);
    --icon-blue-fg: var(--kt-accent-ink, #007aff);
    --icon-purple-bg: var(--kt-accent-soft-bg, #dbeafe);
    --icon-purple-fg: var(--kt-accent-bright, #0a84ff);
    --icon-indigo-bg: var(--kt-accent-soft-bg, #dbeafe);
    --icon-indigo-fg: var(--kt-accent-ink, #007aff);
    --chart-blue: #007aff;
    --chart-indigo: #0a84ff;
  }

  html.pm-app-o4 [data-dash-theme="dark"] body.pm-parent-rail {
    --primary: #0a84ff;
    --primary-hover: #4aa8ff;
    --primary-soft: rgba(10, 132, 255, .16);
    --primary-ink: #4aa8ff;
    --blue-soft: rgba(0, 122, 255, .16);
    --blue-ink: #9dc9ff;
    --indigo-soft: rgba(0, 122, 255, .16);
    --indigo-ink: #9dc9ff;
    --icon-blue-bg: rgba(0, 122, 255, .18);
    --icon-blue-fg: #3d9bff;
    --icon-purple-bg: rgba(0, 96, 223, .18);
    --icon-purple-fg: #0a84ff;
    --icon-indigo-bg: rgba(0, 122, 255, .18);
    --icon-indigo-fg: #3d9bff;
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__tab:hover {
    color: var(--kt-accent-ink, #0b3d6b);
    background: var(--kt-accent-soft-bg, #f4f8ff);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__tab.is-active {
    color: var(--kt-accent-ink, #0b3d6b);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__panes {
    box-shadow: 0 2px 6px rgba(15, 23, 42, .04),
                0 14px 36px -12px rgba(0, 122, 255, .26);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip:hover {
    background: rgba(0, 122, 255, .07);
    border-color: rgba(0, 96, 223, .35);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip.is-active {
    background: rgba(0, 122, 255, .13);
    border-color: #007aff;
    color: #0b3d6b;
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip-avatar {
    background: linear-gradient(135deg, #007aff, #0b3d6b);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf-jcard {
    background:
      linear-gradient(180deg, rgba(0, 122, 255, .03) 0%, rgba(255, 255, 255, 1) 60%),
      var(--card, #fff);
    border-color: rgba(0, 96, 223, .18);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf-jcard:hover {
    border-color: rgba(0, 96, 223, .45);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 12px -4px rgba(0, 122, 255, .22);
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf-map-open {
    color: #0b3d6b;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-trigger {
    background:
      linear-gradient(180deg, rgba(0, 122, 255, .045) 0%, var(--card, #fff) 60%),
      var(--card, #fff);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-trigger:hover {
    border-color: rgba(0, 96, 223, .50);
    box-shadow: 0 4px 14px -6px rgba(0, 122, 255, .25);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-stats,
  html.pm-app-o4 body.pm-parent-rail #nxStatsCard {
    background:
      linear-gradient(180deg, rgba(0, 122, 255, .045) 0%, var(--card, #fff) 60%),
      var(--card, #fff);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-stats__cell {
    border-right-color: rgba(0, 96, 223, .16);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-stats__usage {
    border-top-color: rgba(0, 96, 223, .16);
  }

  html.pm-app-o4 body.pm-parent-rail #dbnbCard.is-cache-painted::after {
    background: #eff6ff;
    color: #0060df;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-convo__avatar {
    background: linear-gradient(135deg, #007aff 0%, #0b3d6b 100%);
    box-shadow: 0 3px 8px -2px rgba(0, 122, 255, .30);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-contract:hover {
    background: rgba(0, 122, 255, .05);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-task-tab.is-active .nx-tab-count {
    background: #007aff;
  }

  html.pm-app-o4 body.pm-parent-rail #cbSubmit {
    background: linear-gradient(135deg, #007aff, #0b3d6b) !important;
  }

  html.pm-app-o4 body.pm-parent-rail #cbModal label:has(input[type="radio"]:checked) {
    border-color: #007aff !important;
    background: rgba(0, 122, 255, .07) !important;
    color: #0b3d6b !important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar [data-pm-install]:hover {
    box-shadow: 0 4px 14px rgba(0, 122, 255, .45) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-card:hover {
    border-color: rgba(0, 96, 223, .55);
    box-shadow: 0 2px 6px rgba(15, 23, 42, .04),
                0 18px 40px -18px rgba(0, 122, 255, .30);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-card__title::before {
    background: linear-gradient(180deg, #007aff, #3d9bff);
  }

  html.pm-app-o4[data-dash-theme="light"] body.pm-parent-rail .nx-kpi {
    box-shadow:
      0 0 0 1px rgba(15, 23, 42, .06),
      0 1px 3px rgba(15, 23, 42, .04),
      0 16px 36px -18px rgba(0, 122, 255, .22) !important;
  }

  html.pm-app-o4[data-dash-theme="light"] body.pm-parent-rail .nx-kpi:hover {
    box-shadow:
      0 0 0 1px rgba(0, 96, 223, .18),
      0 4px 10px rgba(15, 23, 42, .05),
      0 18px 40px -16px rgba(0, 122, 255, .32) !important;
  }

  html.pm-app-o4 [data-dash-theme="dark"] body.pm-parent-rail .nx-up__type,
  html.pm-app-o4 [data-dash-theme="dark"] body.pm-parent-rail .nx-hw__subj,
  html.pm-app-o4 [data-dash-theme="dark"] body.pm-parent-rail .nx-pill--draft {
    background: rgba(0, 122, 255, .16);
    color: #9dc9ff;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today {
    background: #eff6ff;
    border-color: #bfdbfe;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today:hover {
    background: #dbeafe;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today .pmcal-day {
    color: #0b3d6b;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-dayhead.is-today .pmcal-week-dayhead__wd {
    color: #007aff;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-dayhead.is-today .pmcal-week-dayhead__num {
    background: #007aff;
  }

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-col.is-today {
    background-color: #f4f8ff;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-viewall {
    background: linear-gradient(135deg, #0b3d6b 0%, #007aff 55%, #0a84ff 100%);
    box-shadow: 0 10px 22px -10px rgba(11, 61, 107, .65), inset 0 1px 0 rgba(255, 255, 255, .22);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-viewall:hover {
    background: linear-gradient(135deg, #007aff 0%, #0a84ff 100%);
    box-shadow: 0 14px 28px -10px rgba(11, 61, 107, .75), inset 0 1px 0 rgba(255, 255, 255, .25);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-scroll::-webkit-scrollbar-thumb {
    background: #dbeafe;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-footer__mark {
    background: var(--kt-primary-grad, linear-gradient(135deg, #0b3d6b, #0a84ff));
    box-shadow: 0 8px 16px -8px rgba(11, 61, 107, .55);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-footer__rule {
    background: linear-gradient(90deg, transparent, rgba(0, 96, 223, .28) 18%, rgba(0, 96, 223, .28) 82%, transparent);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-footer__tag {
    color: var(--kt-accent-ink, #0060df);
  }

  html.pm-app-o4 body.pm-parent-rail .par-actions--bar .par-action {
    color: #eff6ff;
  }

/* ── 2 + 3. REFINEMENTS + non-parent-rail greens (hand-tuned, win last) ───── */
  html.pm-app-o4 body.pm-parent-rail {
    /* Phase 40z — read the switchable --kt-* theme tokens (parent shares the
       kid's palette system). Blue fallback = the parent's prior refinement ramp. */
    --pmkid-nav-grad: var(--kt-chrome-grad, linear-gradient(180deg,#0057D6 0%,#0A84FF 60%,#3D9BFF 100%)) !important;
    --pmkid-purple-deep: var(--kt-chrome-deep, #0060DF) !important;
    --pmkid-purple-bright: var(--kt-chrome-bright, #0A84FF) !important;
    --pmkid-purple-soft: var(--kt-chrome-soft, #4AA8FF) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-nav {
    box-shadow: 6px 0 34px -14px rgba(0,96,223,.5), inset -1px 0 0 rgba(255,255,255,.10);
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-nav__logo {
    box-shadow: 0 6px 18px -8px rgba(0,54,120,.5);
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item__icon,
  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item:hover {
    background: linear-gradient(135deg,#eef4fb 0%,#dbe9fc 100%);
  }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item:hover { color: #0060DF; }

  html.pm-app-o4 body.pm-parent-rail .pmkid-fly__item.is-active {
    background: var(--kt-primary-grad, linear-gradient(135deg,#0060DF 0%,#0A84FF 100%));
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar {
    background: var(--kt-topbar-grad, linear-gradient(120deg,#0060DF 0%,#007AFF 55%,#0A84FF 100%)) !important;
    border-bottom: 1px solid rgba(0,64,150,.55) !important;
    box-shadow: 0 10px 24px -14px rgba(0,64,150,.6), inset 0 1px 0 rgba(255,255,255,.18) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-topbar .nx-userpod__avatar {
    background: var(--kt-primary-grad, linear-gradient(135deg,#0060DF 0%,#0A84FF 100%)) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px -1px rgba(0,64,150,.5) !important;
  }

  html.pm-app-o4 body.pm-parent-rail .par-actions--bar {
    background: rgba(0,48,110,.38);
  }

  html.pm-app-o4 body.pm-parent-rail .par-actions--bar .par-action { color: #eaf3ff; }

  html.pm-app-o4 body.pm-parent-rail .par-actions--bar .par-action:hover { color: #0060DF; }

  html.pm-app-o4 body.pm-parent-rail .par-action__tip { background: #0a2a4a; color: #eaf3ff; }
  html.pm-app-o4 body.pm-parent-rail .par-action__tip::before { background: #0a2a4a; }

  html.pm-app-o4 .nx-stats__usage:not(.is-low):not(.is-empty) .nx-stats__usage-fill{
    /* Phase 40aa — the hours progress bar follows the theme (low=amber / empty=red stay). */
    background:var(--kt-primary-grad, linear-gradient(135deg,#0A84FF 0%,#007AFF 55%,#0060DF 100%));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.10),0 0 12px rgba(0,96,223,.45);
  }

  html.pm-app-o4 body.pm-parent-rail .nx-stats,
  html.pm-app-o4 body.pm-parent-rail #nxStatsCard{
    background:linear-gradient(180deg,rgba(0,122,255,.05) 0%,var(--card,#fff) 60%),var(--card,#fff)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-stats__cell{border-right-color:rgba(0,122,255,.16)!important;}
  html.pm-app-o4 body.pm-parent-rail .nx-stats__usage{border-top-color:rgba(0,122,255,.16)!important;}
  html.pm-app-o4 body.pm-parent-rail .nx-stats__cell:nth-child(3),
  html.pm-app-o4 body.pm-parent-rail .nx-stats__cell:nth-child(4){border-top-color:rgba(0,122,255,.16)!important;}

  html.pm-app-o4 body.pm-parent-rail .nx-card,
  html.pm-app-o4 body.pm-parent-rail .nx-stats,
  html.pm-app-o4 body.pm-parent-rail #nxStatsCard,
  html.pm-app-o4 body.pm-parent-rail #nxNotifStrip .nx-notif-trigger{
    border:1.5px solid rgba(0,122,255,.18)!important;
    box-shadow:0 6px 22px rgba(0,96,223,.08)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .pmpf{--pmpf-trim:color-mix(in srgb, var(--kt-accent-bright,#a9d4ff) 40%, #fff);}

  html.pm-app-o4 body.pm-parent-rail .nx-card:hover{
    border-color:rgba(0,122,255,.35)!important;
    box-shadow:0 2px 6px rgba(15,23,42,.04),0 18px 40px -18px rgba(0,96,223,.30)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-card__title::before{
    background:linear-gradient(180deg,#0A84FF 0%,#0060DF 100%)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-trigger{
    background:linear-gradient(180deg,rgba(0,122,255,.045) 0%,var(--card,#fff) 60%),var(--card,#fff)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-trigger:hover{
    border-color:rgba(0,122,255,.45)!important;
    box-shadow:0 4px 14px -6px rgba(0,96,223,.25)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-viewall{
    background:linear-gradient(135deg,#0060DF 0%,#007AFF 55%,#0A84FF 100%)!important;
    box-shadow:0 10px 22px -10px rgba(0,96,223,.60),inset 0 1px 0 rgba(255,255,255,.22)!important;
  }
  html.pm-app-o4 body.pm-parent-rail .nx-notif-viewall:hover{
    background:linear-gradient(135deg,#0057D6 0%,#2B8FFF 100%)!important;
  }

  html.pm-app-o4 body.pm-parent-rail .nx-notif-scroll::-webkit-scrollbar-thumb{background:#bcd9fb!important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf{--pmpf-trim:color-mix(in srgb, var(--kt-accent-bright,#93C5FD) 45%, #fff) !important;}

  /* Phase 40cc.11 — Family Portfolio pill tabs (.pmpf--sw) follow the CHOSEN theme: active + hover TEXT, BORDER,
     soft hover WASH and the active LIFT all read from --kt-* (blue = fallback). The premium light-outline look
     (Caleb: "almost no fill, just a nice border + text + soft lift") is unchanged — only the colour tracks the theme. */
  html.pm-app-o4 body.pm-parent-rail .pmpf__tab:hover{color:var(--kt-accent-ink,#1E40AF) !important;background:var(--kt-accent-soft-bg,#F8FBFF) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf__tab.is-active{color:var(--kt-accent-ink,#1E3A8A) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf--sw .pmpf__tab:hover{border-color:color-mix(in srgb, var(--kt-accent-bright,#2563EB) 45%, #fff) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf--sw .pmpf__tab.is-active{border-color:var(--kt-accent-ink,#2563EB) !important;box-shadow:0 1px 2px color-mix(in srgb, var(--kt-accent-bright,#2563EB) 12%, transparent),0 8px 20px -10px color-mix(in srgb, var(--kt-accent-bright,#2563EB) 42%, transparent) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf__panes{box-shadow:0 2px 6px rgba(15,23,42,.04),0 14px 36px -12px rgba(59,130,246,.22) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip:hover{background:color-mix(in srgb, var(--kt-accent-ink,#007aff) 7%, transparent) !important;border-color:color-mix(in srgb, var(--kt-accent-ink,#007aff) 35%, transparent) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip.is-active{background:color-mix(in srgb, var(--kt-accent-ink,#007aff) 13%, transparent) !important;border-color:var(--kt-accent-ink,#007AFF) !important;color:var(--kt-accent-deep,#0060DF) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf__subchip-avatar{background:var(--kt-primary-grad, linear-gradient(135deg,#0A84FF,#0060DF)) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf-map-open{color:#007AFF !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today,html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today.has-renewal{background:#EFF6FF !important;border-color:#BFDBFE !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today:hover{background:#DBEAFE !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-cell.is-today .pmcal-day{color:#1E40AF !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-dayhead.is-today .pmcal-week-dayhead__wd{color:#007AFF !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-dayhead.is-today .pmcal-week-dayhead__num{background:#007AFF !important;}

  html.pm-app-o4 body.pm-parent-rail .pmcal-week-col.is-today{background-color:#EFF6FF !important;}

  html.pm-app-o4 #sharedCalendarCard .gcal-live{color:var(--kt-accent-deep,#0060DF);background:var(--kt-accent-soft-bg,#eaf2ff);border-color:color-mix(in srgb, var(--kt-accent-bright,#007AFF) 30%, #fff);}

  html.pm-app-o4 #sharedCalendarCard .gcal-livedot{background:var(--kt-accent-bright,#007AFF);}

  html.pm-app-o4 .pmcv-share--on{background:#eaf2ff;border-color:#c3ddff;color:#0060DF;}
  html.pm-app-o4 .pmcv-share--on:hover{border-color:#007AFF;}

  html.pm-app-o4 .pmcv-step--done .pmcv-step__n{background:#eef4fb;color:var(--kt-accent-ink,#0060DF);}

  /* Phase 40aa — the little accent BAR beside every widget title follows the theme. */
  html.pm-app-o4 body.pm-parent-rail .nx-card__title::before{background:var(--kt-dot, linear-gradient(180deg,#007AFF,#0A84FF)) !important;}

  html.pm-app-o4 body.pm-parent-rail .pmpf-map-open{color:var(--kt-accent-ink,#0060DF) !important;}

  html.pm-app-o4 .nx-card__title::before{background:var(--kt-dot, linear-gradient(180deg,#0A84FF 0%,#0060DF 100%)) !important;}

  html.pm-app-o4 .nx-card__cta{color:var(--kt-accent-ink,#007AFF) !important;}

  html.pm-app-o4 .nx-task-tab.is-active .nx-tab-count{background:var(--kt-accent-ink,#007AFF) !important;}

  html.pm-app-o4 .nx-task__check--done{background:var(--kt-accent-ink,#007AFF) !important;border-color:var(--kt-accent-ink,#007AFF) !important;box-shadow:0 0 0 3px rgba(0,122,255,.15) !important;}

  html.pm-app-o4 .nx-hw__pill--done{background:var(--kt-accent-soft-bg,#eff6ff) !important;color:var(--kt-accent-ink,#007AFF) !important;}

  html.pm-app-o4 .nx-convo__avatar{background:var(--kt-primary-grad, linear-gradient(135deg,#3b82f6 0%,#4f46e5 100%))!important;box-shadow:0 3px 8px -2px rgba(37,99,235,.28)!important;}

  html.pm-app-o4 .nx-card__cta{color:var(--kt-accent-ink,#007AFF)!important;}

  html.pm-app-o4 .nx-card__title::before{background:var(--kt-dot, linear-gradient(180deg,#0A84FF 0%,#0060DF 100%))!important;}

  html.pm-app-o4 .nx-attstat__num--success ~ .nx-attstat__label::before{background:var(--kt-accent-bright,#007AFF)!important;}

  html.pm-app-o4 .nx-card:hover{border-color:rgba(0,122,255,.40)!important;box-shadow:0 2px 6px rgba(15,23,42,.04),0 18px 40px -18px rgba(0,96,223,.30)!important;}

  html.pm-app-o4 .apexcharts-series[seriesName="Attended"] .apexcharts-bar-area,html.pm-app-o4 .apexcharts-series[seriesName="Attended"] path{fill:var(--kt-accent-bright,#007AFF)!important;}
  html.pm-app-o4 .apexcharts-legend-series:first-child .apexcharts-legend-marker{background:var(--kt-accent-bright,#007AFF)!important;}

/* ── EXTRA: "See your child's account" persona-switch pill (green inline <style>,
      client-dashboard.html #pmDemoViewSwitch) → blue ── */
  html.pm-app-o4 #pmDemoViewSwitch {
    background: linear-gradient(135deg,#0060DF 0%,#007AFF 55%,#0A84FF 100%) !important;
    box-shadow: 0 14px 34px -12px rgba(0,64,150,.7), inset 0 1px 0 rgba(255,255,255,.25) !important;
  }
  html.pm-app-o4 #pmDemoViewSwitch:hover {
    box-shadow: 0 18px 40px -12px rgba(0,64,150,.8), inset 0 1px 0 rgba(255,255,255,.3) !important;
  }

/* ── EXTRA: EN language picker (js/pm-i18n.js inline <style>, teal) → blue ── */
  html.pm-app-o4 .pmlang__item:hover {
    border-color: rgba(0,122,255,.45) !important;
    background: #f7faff !important;
    box-shadow: 0 8px 18px -10px rgba(0,96,223,.35) !important;
  }
  html.pm-app-o4 .pmlang__item.is-active {
    border-color: rgba(0,122,255,.55) !important;
    background: linear-gradient(180deg,#f4f8ff 0%,#ffffff 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(0,122,255,.25), 0 6px 16px -10px rgba(0,96,223,.40) !important;
  }
  html.pm-app-o4 .pmlang__item.is-active .pmlang__native { color: #0060DF !important; }
  html.pm-app-o4 .pmlang__check {
    background: linear-gradient(135deg,#007AFF,#0A84FF) !important;
    box-shadow: 0 3px 8px -2px rgba(0,96,223,.55) !important;
  }

}
