/* Yezbi brand palettes for Homeschool (Derek, October 8, 2026). Loaded after parent-experience.css on every
   Homeschool page, with /shared/brand/yezbi-tokens.css and brand-header.css.
   The saved scheme values do not change: paper-sage is Light and midnight-teal is Dark (localStorage
   hh-parent-appearance-v1). Only their colors change. shared/ui/appearance.js puts the matching
   data-yezbi-theme (light/dark) on <html>, so the --yz-* tokens follow the same Light/Dark switch.
   Not mapped here, on purpose: each child's saved calendar color (and its position fallback in js/parent.js),
   the calendar category colors, and the always-dark student, tutorial and print surfaces. */

/* Large surfaces stay neutral: cool paper and white in Light, deep slate in Dark. */
:root:is([data-hh-scheme="paper-sage"],[data-hh-scheme="midnight-teal"]){
  --bg:var(--yz-background);
  --bg-elev:var(--yz-surface);
  /* Mostly used as a border, sometimes as a hover or pressed surface, like the earlier sage #d6dfca. */
  --bg-elev-2:var(--yz-border);
  --hh-line:var(--yz-border);
  /* Field and control edges: 3:1 or better against the surface. */
  --hh-control-line:var(--yz-control-border);
  --hh-grid:var(--yz-background);
  --text:var(--yz-text);
  --text-muted:var(--yz-muted);
  --text-dim:var(--yz-muted);
  /* Softer blue for primary actions, links and focus. */
  --accent:var(--yz-primary);
  --accent-hover:var(--yz-primary-hover);
  --hh-on-accent:var(--yz-on-primary);
  /* Green for completion, always next to a check or words. */
  --hh-positive:var(--yz-success);
  --leaf:var(--yz-success);
  --danger:var(--yz-danger);
  /* Status text. Gold carries "attention" and restrained terracotta carries emphasis. */
  --hh-ink-danger:var(--yz-danger);
  --hh-ink-success:var(--yz-success);
  --hh-ink-warning:var(--yz-gold);
  --hh-ink-highlight:var(--yz-emphasis);
  --hh-theme-color:var(--yz-header-bg);
}
:root[data-hh-scheme="paper-sage"]{--shadow:0 3px 12px rgba(36,50,71,.08);--hh-hour-line:rgba(36,50,71,.09)}
:root[data-hh-scheme="midnight-teal"]{--shadow:0 6px 24px rgba(0,0,0,.35);--hh-hour-line:rgba(237,242,247,.08)}

/* Secondary text on category-tinted calendar cards (Light): a little darker than --yz-muted, so times and names keep
   4.5:1 on the palest and the pinkest tints. The category tints themselves are unchanged. */
html[data-hh-scheme="paper-sage"] :is(.schedule-block,.schedule-anytime-card,.week-calendar-event,.week-calendar-untimed-card,.week-block-chip,.planner-block,.month-event,.hh-agenda-card)[data-calendar-kind]:not([data-calendar-kind="other"]){--text-muted:color-mix(in srgb,var(--yz-muted) 55%,var(--yz-text))}

/* Appearance dialog swatches show the new Light and Dark. */
[data-scheme-choice="paper-sage"] .hh-scheme-swatch{background:linear-gradient(90deg,#F7F8FA 50%,#355FCB 50%)}
[data-scheme-choice="midnight-teal"] .hh-scheme-swatch{background:linear-gradient(90deg,#141B26 50%,#9CB9FF 50%)}

/* Calm selection: soft blue marks the current page; hover is a neutral raised surface. */
html[data-hh-scheme] .hh-sidebar :is(.tab-bar-item,.tab-drawer-link):hover{background:var(--yz-raised);color:var(--text)}
html[data-hh-scheme] .hh-sidebar :is(.tab-bar-item,.tab-drawer-link).active{background:var(--yz-primary-soft);color:var(--hh-accent-ink,var(--accent))}
html[data-hh-layout="mobile"][data-hh-scheme] .tab-bar-item.active{background:var(--yz-primary-soft)}
html[data-hh-layout="mobile"][data-hh-scheme] .tab-bar [data-tab="more"][aria-expanded="true"]{background:var(--yz-primary-soft)}

/* The planner's round + Add button is the main action: the action blue instead of the earlier teal. The calendar
   School · Google · Both choice marks its selection the same way as Day/Week/Month. */
html[data-hh-scheme] .calendar-add-event-fab{background:var(--accent);border-color:var(--accent);color:var(--hh-on-accent);box-shadow:0 6px 18px rgba(20,27,38,.28),0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent)}
html[data-hh-scheme] .calendar-add-event-fab:hover{filter:none;outline:none;background:var(--accent-hover);border-color:var(--accent-hover)}
html[data-hh-scheme] .calendar-add-event-fab:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
html[data-hh-scheme] .calendar-layer-toggle button.active{background:var(--accent);color:var(--hh-on-accent)}

/* Child filters: a child's saved color stays on its dot, beside the name. The chosen chip gets a neutral surface,
   a blue edge and a check, never the child's color as a fill. */
html[data-hh-scheme] .hh-planner-kid-chips button{border-color:var(--hh-control-line)}
html[data-hh-scheme] .hh-planner-kid-chips button[aria-pressed="true"]{background:var(--yz-raised);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);color:var(--text);font-weight:650}
html[data-hh-scheme] .hh-planner-kid-chips button[aria-pressed="true"]::before{content:"✓";content:"✓"/"";color:var(--hh-accent-ink,var(--accent));font-weight:800;line-height:1}

/* Child badges (phone child filter and picker): initials in the ink their fill variant was made for
   (/shared/brand/identity-colors.js: white in Light, slate in Dark, 4.5:1). This wins over the generic ink pick in
   shared/ui/ui-system.js, which reads the background once and would miss a later Light/Dark switch. */
html[data-hh-scheme="paper-sage"] .schedule-kid-avatar{color:#FFFFFF!important}
html[data-hh-scheme="midnight-teal"] .schedule-kid-avatar{color:#141B26!important}

/* Control edges: fields and outlined controls keep a 3:1 edge; cards and dividers stay subtle (--hh-line). */
html[data-hh-scheme] :is(input:not([type=checkbox],[type=radio],[type=range],[type=color],[type=file],[type=hidden],[type=submit],[type=button],[type=reset],[type=image]),select,textarea){border-color:var(--hh-control-line)}
html[data-hh-scheme] :is(.hh-app-tools button,.weekly-resources-tabs button:not(.active),.resource-kind-tab:not(.active),.week-tool-button,.hh-day-print,.weekly-resource-details,.resource-detail-actions button,.act-print-event,.act-edit-event,.ws-quick-action,.modal-close,#manual-event-close,.act-time-scope-cancel,.schedule-period-controls,.weekly-resources-period,.schedule-view-toggle,.hh-day-style,.family-tools nav a,.family-tools button:not([aria-pressed="true"])){border-color:var(--hh-control-line)}
html[data-hh-scheme] .week-header-actions #btn-fill-curriculum{border-color:var(--hh-control-line)}
/* Privacy counts and secondary buttons: the raised surface keeps their muted text at 4.5:1. */
html[data-hh-scheme] :is(.privacy-count,.privacy-btn-secondary){background:var(--yz-raised)}
/* Family tools and Local events buttons: a quiet raised surface, so they read as buttons rather than disabled grey. */
html[data-hh-scheme] .family-tools button:not([aria-pressed="true"]){background:var(--yz-raised)}
html[data-hh-scheme] .hh-app-tools button:hover{border-color:var(--accent)}
html[data-hh-scheme] .hh-scheme-switch[aria-checked="false"] .hh-scheme-switch-track{background:var(--hh-control-line)}
html[data-hh-scheme] .hh-scheme-switch[aria-checked="false"] .hh-scheme-switch-track>span{background:var(--yz-surface)}

/* Keyboard focus: a solid ring in the action blue, 3:1 or better on every surface in both themes. */
html[data-hh-scheme] :is(.guided-tour-actions button,.guided-tour-close):focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* "For grown-ups: privacy" on the child's day, checklist and dashboard screens, and the photo hint beside each
   checklist upload (FOUNDATION-PLAN F part 2b, October 9, 2026; wording from the draft children's privacy notice,
   Part I, marked draft). Small and calm: muted, underlined text with a 24px target. The student checklist is
   always dark, so its colors are fixed like the rest of that surface. */
.hs-grownup-privacy{display:inline-flex;align-items:center;min-height:24px;color:var(--text-muted);font-size:13px;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hs-grownup-privacy:hover{color:var(--text)}
.hs-grownup-privacy:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.hs-draft-note{white-space:pre;font-weight:500}
.hs-grownup-privacy-row{margin:18px 0 0;text-align:center;font-size:13px}
.today-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px 18px}
.today-footer .hs-grownup-privacy{color:var(--text-muted);text-decoration:underline}
.clock-weather-credit{margin-top:4px;font-size:10px;letter-spacing:.02em;color:var(--text-muted)}
.student-mode-page .hs-grownup-privacy{color:#b9aa9c}
.student-mode-page .hs-grownup-privacy:hover{color:#f8efe4}
.student-mode-page .hs-grownup-privacy:focus-visible{outline-color:#f3ad41}
.student-upload-hint{margin:0;color:#b9aa9c;font-size:12px;line-height:1.5}
.student-upload-hint .hs-grownup-privacy{margin-left:6px;font-size:12px}
