/* Legacy feature styles use literal dark colours. Keep their layouts and
   semantic states, while making their surfaces follow the portal theme.
   Printed invoices/payslips and public-site pages are deliberately out of scope. */
html[data-theme="light"] body.team-app :is(input, select, textarea) {
  /* app-cards.css has ID-bearing :is() rules which otherwise force dark pickers. */
  color-scheme: light !important;
}

/* App help and signed-out clock controls. */
html[data-theme="light"] body.team-app :is(.appbar, .app-update, .app-help, .app-dock) {
  background: var(--panel-c);
  color: var(--ink-c);
  border-color: var(--line-c);
}
html[data-theme="light"] body.team-app :is(.appbar__brand, .app-button) { color: var(--ink-c); }
html[data-theme="light"] body.team-app :is(.appbar__brand small, .appbar__site, .app-help p,
  .attendance-note, .attendance-help) { color: var(--muted-c); }
html[data-theme="light"] body.team-app :is(.app-button, .app-help__status) { border-color: var(--line-2-c); }
html[data-theme="light"] body.team-app .app-button:hover { color: var(--accent-c); border-color: var(--accent-c); }
html[data-theme="light"] body.team-app .app-help__install {
  background: var(--accent-c); color: var(--on-accent-c); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app .app-help__install:hover { background: var(--accent-hover-c); color: var(--on-accent-c); }
html[data-theme="light"] body.team-app .attendance-pin-action select {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app .attendance-status {
  background: color-mix(in srgb, var(--ok) 8%, var(--panel-c));
  color: var(--ink-c); border-color: var(--ok);
}
html[data-theme="light"] body.team-app .attendance-status--warn {
  background: var(--app-tint); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app .attendance-break { color: var(--accent-c); }

/* Keep the full-screen menu opaque from its first frame. The original entry
   animation fades the whole panel, exposing page text beneath the menu. */
html[data-theme="light"] body.team-app #tabSheet .tabsheet__panel {
  background: var(--bg-c);
  opacity: 1;
  animation: none;
}

/* Theme changes must not crossfade pale dark-mode text over a light page. */
html[data-theme="light"] body.team-app #gateView :is(.field__reveal, .btn) {
  transition-property: border-color, box-shadow;
}
html[data-theme="light"] body.team-app #gateView :is(.field__reveal, .btn--ghost) {
  color: var(--text-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app #gateView .field__reveal {
  background: var(--panel-c);
}
html[data-theme="light"] body.team-app #gateView :is(.field__reveal:hover, .field__reveal[aria-pressed="true"], .btn--ghost:hover) {
  color: var(--accent-c); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app #gateView .btn--primary {
  background: var(--accent-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app #gateView .btn--primary:hover {
  background: var(--accent-hover-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app #gateView :is(.btn:disabled, .field__reveal:disabled),
html[data-theme="light"] body.team-app #gateView #signinBtn:disabled {
  opacity: 1;
  background: var(--bg-alt-c);
  color: var(--muted-c);
  border-color: var(--line-c);
}

/* Personal account, recovery and hours. */
html[data-theme="light"] body.team-app :is(.account-card, .account-dialog) {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app .account-card { border-top-color: var(--accent-c); }
html[data-theme="light"] body.team-app :is(.account-card p, .account-dialog p) { color: var(--text-c); }
html[data-theme="light"] body.team-app :is(.account-brand span, .account-card .account-hint,
  .si-range, .si-totals span, .si-day-figures dt) { color: var(--muted-c); }
html[data-theme="light"] body.team-app :is(.account-eyebrow, .account-pin-state,
  .si-totals strong, .si-state, .si-code) { color: var(--accent-c); }
html[data-theme="light"] body.team-app .account-pin-state { background: var(--app-tint); }
html[data-theme="light"] body.team-app :is(.account-card input:not([type="checkbox"]),
  .account-pin-form input, .si-field input, .si-field select, .si-field textarea) {
  background: var(--bg-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app :is(.account-card button, .account-button) {
  background: var(--accent-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app :is(.account-card .account-foot, .si-recovery,
  .si-totals > div, .si-day, .si-management) { border-color: var(--line-c); }
html[data-theme="light"] body.team-app .si-notice { border-color: var(--accent-c); background: var(--app-tint); }
html[data-theme="light"] body.team-app #pinManageForm .field-note { color: var(--muted-c); }

/* Cash-up and pay adjustments. */
html[data-theme="light"] body.team-app :is(.cu-workspace, .pa-workspace, .cu-field) { color: var(--text-c); }
html[data-theme="light"] body.team-app :is(.cu-dialog, .cu-card, .cu-period, .cu-editor-actions,
  .pa-workspace, .pa-dialog, .pa-table td:first-child) {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-c);
}
html[data-theme="light"] body.team-app :is(.cu-eyebrow, .cu-note, .pa-note) { color: var(--muted-c); }
html[data-theme="light"] body.team-app :is(.cu-field input, .cu-field select, .cu-field textarea,
  .pa-field input, .pa-field select, .pa-field textarea) {
  background: var(--bg-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app .cu-btn {
  background: var(--accent-c); color: var(--on-accent-c); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app .cu-btn--secondary {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app .cu-tabs [aria-pressed="true"] {
  background: var(--accent-c); color: var(--on-accent-c); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app :is(.cu-table th, .pa-table th, .pa-table th:first-child) {
  background: var(--bg-alt-c); color: var(--ink-c);
}
html[data-theme="light"] body.team-app :is(.cu-scroll, .cu-table th, .cu-table td, .cu-empty,
  .cu-reports, .cu-dialog-head, .cu-count, .cu-line, .cu-detail, .pa-scroll, .pa-table th, .pa-table td) {
  border-color: var(--line-c);
}
html[data-theme="light"] body.team-app :is(.cu-count legend, .cu-count-total, .cu-detail summary,
  .cu-period h4, .cu-entry h3, .pa-head h3, .pa-dialog h2, .pa-history summary) { color: var(--accent-c); }
html[data-theme="light"] body.team-app :is(.cu-entry, .cu-warning, .pa-preview) {
  background: var(--app-tint); color: var(--text-c); border-color: var(--accent-c);
}
html[data-theme="light"] body.team-app .cu-status {
  background: var(--bg-alt-c); color: var(--text-c);
}
html[data-theme="light"] body.team-app .cu-status--submitted {
  background: color-mix(in srgb, var(--accent-c) 12%, var(--panel-c)); color: var(--accent-c);
}
html[data-theme="light"] body.team-app .cu-status--approved {
  background: color-mix(in srgb, var(--ok) 10%, var(--panel-c)); color: var(--ok);
}
html[data-theme="light"] body.team-app .cu-status--void {
  background: color-mix(in srgb, var(--bad) 10%, var(--panel-c)); color: var(--bad);
}

/* Staff compliance, payroll and the dynamically styled Xero books panel. */
html[data-theme="light"] body.team-app :is(.sc-dialog, .xp-card, .xp-dialog, .xp-stat) {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-c);
}
html[data-theme="light"] body.team-app :is(.sc-button, .xp-button) {
  background: var(--panel-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app :is(.sc-button:hover, .xp-button:hover) { background: var(--bg-alt-c); }
html[data-theme="light"] body.team-app :is(.sc-button--primary, .xp-button--primary) {
  background: var(--accent-c); border-color: var(--accent-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app :is(.sc-button--primary:hover, .xp-button--primary:hover) {
  background: var(--accent-hover-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app :is(.sc-hint, .xp-intro, .xp-hint, .xp-stat span,
  .xp-secondary, .xp-private-reference, .xp-empty) { color: var(--muted-c); }
html[data-theme="light"] body.team-app :is(.sc-link, .xp-link, .xp-eyebrow) { color: var(--accent-c); }
html[data-theme="light"] body.team-app :is(.sc-field input:not([type="checkbox"]), .sc-field select,
  .sc-field textarea, .xp-field input:not([type="checkbox"]), .xp-field select, .xp-field textarea,
  .xb-table select, .xb-table input[type="text"]) {
  background: var(--bg-c); color: var(--ink-c); border-color: var(--line-2-c);
}
html[data-theme="light"] body.team-app :is(.sc-section, .sc-document, .sc-history, .xp-table-wrap,
  .xp-table th, .xp-table td, .xp-details, .xp-empty, .xp-batch, .xb-lines li) { border-color: var(--line-c); }
html[data-theme="light"] body.team-app .xp-table th { background: var(--bg-alt-c); color: var(--ink-c); }
html[data-theme="light"] body.team-app :is(.sc-status, .xp-note, .xb-confirm) {
  background: var(--app-tint); border-color: var(--accent-c); color: var(--text-c);
}
html[data-theme="light"] body.team-app .xp-badge {
  background: color-mix(in srgb, var(--accent-c) 10%, var(--panel-c));
  border-color: var(--accent-c); color: var(--accent-c);
}
html[data-theme="light"] body.team-app .xp-badge--good {
  background: color-mix(in srgb, var(--ok) 10%, var(--panel-c)); border-color: var(--ok); color: var(--ok);
}
html[data-theme="light"] body.team-app .xp-badge--warn {
  background: color-mix(in srgb, var(--bad) 8%, var(--panel-c)); border-color: var(--bad); color: var(--bad);
}

/* Semantic feedback stays coloured and labelled in either appearance. */
html[data-theme="light"] body.team-app :is(.cu-error, .pa-error, .pa-negative, .bu-error,
  .sc-message.is-error, .xp-message.is-error, .dtl-status.is-error, .rc-status.is-error,
  .eod-status--bad, .iv-message--error, .st-status--out) { color: var(--bad); }
html[data-theme="light"] body.team-app :is(.st-status--ok, .eod-badge--complete,
  .event-prep-peak, .event-prep-estimate) { color: var(--ok); }
html[data-theme="light"] body.team-app :is(.event-prep-warning, .event-prep-time,
  .dy-event-card .dy-event-card__time, .event-prep-card__action, .event-prep-dialog__time,
  .planning-event__time, .planning-events-note.is-warning, .planning-event-count,
  .wf-warning, .wf-attention__count, .wf-attention__error, .schedule-state.is-changed) { color: var(--accent-c); }
html[data-theme="light"] body.team-app :is(.schedule-library p, .schedule-help, .schedule-metrics span,
  .schedule-recipient small, .schedule-preview-note, .schedule-total-label, .schedule-auto) { color: var(--muted-c); }
html[data-theme="light"] body.team-app :is(.dtl-section, .dtl-card, .dtl-editor, .dtl-weekdays,
  .eod-section, .rc-report-catalogue, .rc-fieldset, .rc-table th, .rc-table td,
  .sales-import__table th, .sales-import__table td) { border-color: var(--line-c); }
html[data-theme="light"] body.team-app .rc-table th { background: var(--panel-c); }
html[data-theme="light"] body.team-app .sales-import__summary { background: var(--bg-alt-c); }
html[data-theme="light"] body.team-app .dashboard-week__bar { background: var(--line-2-c); }
html[data-theme="light"] body.team-app .dashboard-week__day.is-today .dashboard-week__bar { background: var(--accent-c); }
html[data-theme="light"] body.team-app .lhg-target { background: var(--ink-c); box-shadow: 0 0 0 1px var(--panel-c); }

/* Invoice buttons take a paired foreground from the accent token. State badges
   retain their existing separate labelled colours and document paper stays white. */
html[data-theme="light"] body.team-app .iv-btn--primary { color: var(--on-accent-c); }
html[data-theme="light"] body.team-app .iv-btn--primary:hover {
  background: var(--accent-hover-c); color: var(--on-accent-c);
}
html[data-theme="light"] body.team-app :is(.cu-check input, .sc-check input, .xp-check input) { accent-color: var(--accent-c); }
html[data-theme="light"] body.team-app :is(.cu-btn, .cu-workspace input, .cu-dialog input,
  .cu-dialog select, .cu-dialog textarea, .pa-workspace button, .pa-dialog button,
  .pa-dialog input, .pa-dialog select, .pa-dialog textarea, .sc-button, .sc-field input,
  .sc-field select, .sc-field textarea, .sc-link, .xp-button, .xp-field input,
  .xp-field select, .xp-field textarea, .xp-link):focus-visible { outline-color: var(--accent-c); }