/* SciCal600 appearance switch -------------------------------------------------
   This file loads last so one coherent bright palette can cover every workspace
   without changing the familiar physical-calculator face. */

.theme-toggle {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 7px 11px;
  border: 1px solid rgba(255, 205, 92, 0.3);
  border-radius: 12px;
  background: rgba(255, 205, 92, 0.08);
  color: #f6d887;
  cursor: pointer;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
  transition: transform 300ms var(--ease-spring), background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.theme-toggle__icon {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  font-size: 15px;
  line-height: 1;
}

.theme-toggle[aria-pressed="true"] {
  border-color: rgba(8, 127, 105, 0.3);
  background: rgba(8, 127, 105, 0.09);
  color: #076c5b;
}

button.is-pressed.theme-toggle {
  filter: brightness(1.08);
  transform: translateY(2px) scale(0.975);
}

@media (hover: hover) and (pointer: fine) {
  .theme-toggle:not(.is-pressed):hover {
    transform: translateY(-1px);
    filter: brightness(1.08);
  }
}

/* Bright palette */
html[data-theme="bright"] {
  color-scheme: light;
  --bg: #eef7f6;
  --bg-soft: #ffffff;
  --ink: #142a32;
  --muted: #5b6f77;
  --cyan: #087f69;
  --cyan-soft: rgba(8, 127, 105, 0.1);
  --orange: #a6530b;
  --red: #b52832;
}

html[data-theme="bright"] body {
  background:
    linear-gradient(rgba(20, 74, 81, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20, 74, 81, 0.045) 1px, transparent 1px),
    var(--bg);
  background-color: #eef7f6;
  background-size: 48px 48px;
}

html[data-theme="bright"] .page-glow--one { background: rgba(37, 155, 181, 0.15); }
html[data-theme="bright"] .page-glow--two { background: rgba(41, 176, 129, 0.12); }

html[data-theme="bright"] .app-bar,
html[data-theme="bright"] .calculator-dock {
  border-color: rgba(18, 68, 74, 0.13);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 28px rgba(32, 76, 82, 0.07);
}

html[data-theme="bright"] .brand__identity small,
html[data-theme="bright"] .zoom-controls output,
html[data-theme="bright"] .calculator-dock__status { color: #61777f; }

html[data-theme="bright"] .app-nav-button,
html[data-theme="bright"] .zoom-controls,
html[data-theme="bright"] .calculator-dock button {
  border-color: rgba(18, 68, 74, 0.16);
  background: rgba(15, 90, 94, 0.045);
  color: #294850;
}

html[data-theme="bright"] .zoom-controls button { color: #46636b; }
html[data-theme="bright"] .interface-mode-toggle {
  border-color: rgba(8, 127, 105, 0.25);
  background: rgba(8, 127, 105, 0.075);
  color: #156f60;
}
html[data-theme="bright"] .interface-mode-toggle[aria-pressed="true"] {
  border-color: rgba(166, 83, 11, 0.3);
  background: rgba(166, 83, 11, 0.09);
  color: #8a480f;
}

html[data-theme="bright"] h1 span { color: #60767e; }
html[data-theme="bright"] .content-page__lead { color: #50666f; }
html[data-theme="bright"] .linear-hero,
html[data-theme="bright"] .manual-hero,
html[data-theme="bright"] .content-footer,
html[data-theme="bright"] footer,
html[data-theme="bright"] .scope { border-color: rgba(18, 68, 74, 0.13); }

html[data-theme="bright"] .primary-action {
  border-color: rgba(8, 127, 105, 0.28);
  background: rgba(8, 127, 105, 0.1);
  color: #076c5b;
}

html[data-theme="bright"] .language-picker select {
  border-color: rgba(18, 68, 74, 0.18);
  background: #ffffff;
  color: #294850;
  box-shadow: 0 8px 24px rgba(32, 76, 82, 0.1);
}

/* Home, manual and project information */
html[data-theme="bright"] .home-tool-card,
html[data-theme="bright"] .manual-section,
html[data-theme="bright"] .scope-card {
  border-color: rgba(8, 127, 105, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.97), rgba(235, 248, 245, 0.95));
  box-shadow: 0 18px 44px rgba(35, 85, 84, 0.11);
}

html[data-theme="bright"] .home-tool-card h3,
html[data-theme="bright"] .matrix-workspace__header h2 { color: #17343b; }
html[data-theme="bright"] .home-tool-card p,
html[data-theme="bright"] .scope-card p:last-child,
html[data-theme="bright"] .manual-section p,
html[data-theme="bright"] .manual-section li,
html[data-theme="bright"] .manual-model-banner p { color: #586e76; }

html[data-theme="bright"] .manual-model-banner,
html[data-theme="bright"] .reference-model-banner {
  border-color: rgba(8, 127, 105, 0.24);
  background: linear-gradient(110deg, rgba(8, 127, 105, 0.11), rgba(255, 255, 255, 0.88));
}

html[data-theme="bright"] .manual-index a {
  border-color: rgba(18, 68, 74, 0.16);
  color: #566d75;
}
html[data-theme="bright"] .manual-section code { color: #076c5b; }

/* Linear algebra */
html[data-theme="bright"] .matrix-workspace {
  border-color: rgba(8, 127, 105, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(235, 247, 245, 0.98));
  box-shadow: 0 28px 70px rgba(35, 85, 84, 0.13);
}

html[data-theme="bright"] .matrix-card,
html[data-theme="bright"] .matrix-result,
html[data-theme="bright"] .eigen-card {
  border-color: rgba(18, 68, 74, 0.15);
  background: rgba(255, 255, 255, 0.78);
}

html[data-theme="bright"] .matrix-example-list button,
html[data-theme="bright"] .matrix-template-row button,
html[data-theme="bright"] .matrix-swap,
html[data-theme="bright"] .matrix-operation-palette button {
  border-color: rgba(18, 68, 74, 0.16);
  background: rgba(255, 255, 255, 0.82);
  color: #38545c;
}

html[data-theme="bright"] .matrix-operation-palette button strong,
html[data-theme="bright"] .matrix-card label,
html[data-theme="bright"] .matrix-result__header strong { color: #17343b; }
html[data-theme="bright"] .matrix-operation-palette button span,
html[data-theme="bright"] .matrix-card output,
html[data-theme="bright"] .matrix-input-hint,
html[data-theme="bright"] .matrix-note,
html[data-theme="bright"] .matrix-result__summary,
html[data-theme="bright"] .eigen-card > span { color: #5d727a; }

html[data-theme="bright"] .matrix-operation-palette button.is-selected {
  border-color: rgba(8, 127, 105, 0.52);
  background: linear-gradient(145deg, rgba(8, 127, 105, 0.14), rgba(8, 127, 105, 0.06));
  box-shadow: 0 8px 22px rgba(35, 85, 84, 0.09);
}

html[data-theme="bright"] .matrix-expression-preview,
html[data-theme="bright"] .matrix-card.has-valid-input output { background: rgba(8, 127, 105, 0.08); }
html[data-theme="bright"] .matrix-card textarea,
html[data-theme="bright"] .matrix-controls select {
  border-color: rgba(18, 68, 74, 0.2);
  background: #ffffff;
  color: #17343b;
}
html[data-theme="bright"] .matrix-result__header { border-color: rgba(18, 68, 74, 0.12); }

/* Statistics, probability, computer and economics workspaces */
html[data-theme="bright"] .computer-quick-nav {
  border-color: rgba(18, 68, 74, 0.15);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 12px 34px rgba(35, 85, 84, 0.09);
}

html[data-theme="bright"] .computer-quick-nav button,
html[data-theme="bright"] .computer-tool-card {
  border-color: rgba(18, 68, 74, 0.15);
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(35, 85, 84, 0.1);
}

html[data-theme="bright"] .computer-quick-nav button.is-selected { border-color: rgba(8, 127, 105, 0.42); background: var(--cyan-soft); }
html[data-theme="bright"] .computer-tool-card input,
html[data-theme="bright"] .computer-tool-card select,
html[data-theme="bright"] .computer-tool-card textarea {
  border-color: rgba(18, 68, 74, 0.2);
  background: #f8fcfb;
  color: #17343b;
}

html[data-theme="bright"] .computer-tool-card > button:not(.primary-action),
html[data-theme="bright"] .button-row button {
  border-color: rgba(18, 68, 74, 0.18);
  background: rgba(15, 90, 94, 0.06);
  color: #294850;
}

html[data-theme="bright"] .computer-result {
  background: rgba(8, 127, 105, 0.08);
  color: #155a4f;
}
html[data-theme="bright"] .computer-result.is-error,
html[data-theme="bright"] .content-page--analysis .data-status.is-error { color: #a5222c; }
html[data-theme="bright"] .radix-result,
html[data-theme="bright"] .register-grid span,
html[data-theme="bright"] .mailbox-grid span,
html[data-theme="bright"] .rate-card,
html[data-theme="bright"] .status-badge { background: rgba(15, 90, 94, 0.06); }
html[data-theme="bright"] .flag-row span { background: rgba(15, 90, 94, 0.08); }
html[data-theme="bright"] .flag-row span.is-set { color: #8a480f; }
html[data-theme="bright"] .analysis-table-scroll { border-color: rgba(18, 68, 74, 0.15); }
html[data-theme="bright"] .analysis-table th { background: #e1efed; }
html[data-theme="bright"] .analysis-table th,
html[data-theme="bright"] .analysis-table td,
html[data-theme="bright"] .finance-table th,
html[data-theme="bright"] .finance-table td { border-color: rgba(18, 68, 74, 0.12); }
html[data-theme="bright"] .status-badge.is-reference { color: #176756; }
html[data-theme="bright"] .status-badge.is-stale { color: #884812; }
html[data-theme="bright"] .status-badge.is-error { color: #a5222c; }

/* Web workbenches and dialogs */
html[data-theme="bright"] .mode-workbench,
html[data-theme="bright"] .panel-dialog {
  border-color: rgba(18, 68, 74, 0.19);
  background: #f8fcfb;
  color: #17343b;
  box-shadow: 0 24px 70px rgba(31, 70, 75, 0.2);
}

html[data-theme="bright"] .workbench__header p:last-child,
html[data-theme="bright"] .workbench__tip,
html[data-theme="bright"] .entry-form label,
html[data-theme="bright"] .coordinate-form label,
html[data-theme="bright"] .predict-form label,
html[data-theme="bright"] .program-runner label,
html[data-theme="bright"] .formula-form label { color: #5b7179; }

html[data-theme="bright"] .workbench__close,
html[data-theme="bright"] .workbench__toolbar button,
html[data-theme="bright"] .slot-tabs button {
  border-color: rgba(18, 68, 74, 0.2);
  background: #eef6f5;
  color: #405e66;
}

html[data-theme="bright"] .entry-form input,
html[data-theme="bright"] .coordinate-form input,
html[data-theme="bright"] .predict-form input,
html[data-theme="bright"] .program-runner input,
html[data-theme="bright"] .formula-form input,
html[data-theme="bright"] .catalogue-search,
html[data-theme="bright"] .select-label select,
html[data-theme="bright"] .program-editor textarea {
  border-color: rgba(18, 68, 74, 0.2);
  background: #ffffff;
  color: #17343b;
}

html[data-theme="bright"] .data-table-wrap,
html[data-theme="bright"] .data-table th,
html[data-theme="bright"] .data-table td { border-color: rgba(18, 68, 74, 0.15); }
html[data-theme="bright"] .data-table th { background: #e5f1ef; color: #536a72; }
html[data-theme="bright"] .data-table td { color: #3f5a62; }
html[data-theme="bright"] .empty-state,
html[data-theme="bright"] .result-grid div,
html[data-theme="bright"] .catalogue-item,
html[data-theme="bright"] .catalogue-detail,
html[data-theme="bright"] .constant-item {
  border-color: rgba(18, 68, 74, 0.14);
  background: #edf6f4;
  color: #405b63;
}
html[data-theme="bright"] .result-grid strong { color: #17343b; }
html[data-theme="bright"] kbd { border-color: #bdcdcf; background: #edf3f3; color: #3b555d; }

html[data-theme="bright"] .panel-dialog::backdrop { background: rgba(24, 49, 54, 0.35); }
html[data-theme="bright"] .panel-dialog h2 { color: #17343b; }
html[data-theme="bright"] .segmented-control { background: #e5efee; }
html[data-theme="bright"] .segmented-control button { color: #566d75; }

/* The colourful heart animation intentionally retains its night-stage contrast. */
html[data-theme="bright"] .love-egg-copy { color: #536a72; }
html[data-theme="bright"] .love-source-card {
  border-color: rgba(18, 68, 74, 0.16);
  background: #edf6f4;
}
html[data-theme="bright"] .love-source-card summary { color: #294850; }
html[data-theme="bright"] .love-source-card pre {
  border-color: rgba(18, 68, 74, 0.13);
  color: #176756;
}

@media (max-width: 760px) {
  .theme-toggle {
    width: 38px;
    min-width: 38px;
    padding-inline: 7px;
  }

  .theme-toggle > span:last-child { display: none; }
}

@media (max-width: 560px) {
  .theme-toggle,
  .interface-mode-toggle { min-height: 38px; }
  .interface-mode-toggle > span:last-child { display: none; }
}

@media (orientation: landscape) and (max-height: 600px) {
  .theme-toggle { min-height: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}