/* One type system, two appearances. Media and site chrome share these surfaces. */
:root {
  color-scheme: light;
  --screen-surface: #ffffff;
  --screen-toolbar: #f6f8fb;
  --screen-border: #dbe2eb;
  --control-bg: #eef2f7;
  --control-active: #ffffff;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f3f6fb;
  --muted: #a7afbe;
  --blue: #85aaff;
  --cyan: #67d4e6;
  --paper: #111315;
  --soft: #191c21;
  --line: #30353e;
  --screen-surface: #1d2026;
  --screen-toolbar: #252930;
  --screen-border: #3a414c;
  --control-bg: #262c35;
  --control-active: #3b4657;
}

html[data-theme="dark"] ::selection { background: #365c93; color: #ffffff; }
html[data-theme="dark"] .skip { background: var(--control-active); }
html[data-theme="dark"] .site-header {
  background: rgba(17, 19, 21, .87);
  border-bottom-color: rgba(67, 73, 84, .5);
}
html[data-theme="dark"] .hero { background: linear-gradient(#161a21, var(--paper) 60%); }
html[data-theme="dark"] .eyebrow { color: #a8b6cc; }
html[data-theme="dark"] .gradient-text {
  background-image: linear-gradient(105deg, #85a4ff 4%, #79b6ff 49%, #68d5e2 95%);
}
html[data-theme="dark"] .primary,
html[data-theme="dark"] .cookie-actions button { background: #e7edf8; color: #171e2a; }
html[data-theme="dark"] .primary:hover,
html[data-theme="dark"] .cookie-actions button:hover { background: #ffffff; }
html[data-theme="dark"] .product-index a:hover { background: #1b222d; }
html[data-theme="dark"] .index-number,
html[data-theme="dark"] .round-arrow { color: #9caac0; }

/* Personal BI and its shared labels. */
html[data-theme="dark"] .mac-section { background: linear-gradient(110deg, #191d25, #161e25); }
html[data-theme="dark"] .status-badge { border-color: #425878; color: #a2bce8; }
html[data-theme="dark"] .feature-list { color: #b3bfd1; }
html[data-theme="dark"] .feature-list li::before { color: var(--blue); }
html[data-theme="dark"] .text-link { color: #92b5ff; }
html[data-theme="dark"] .text-link:hover { color: #c0d5ff; }
html[data-theme="dark"] .platform-note,
html[data-theme="dark"] .preview-label,
html[data-theme="dark"] .preview-caption { color: #a5b0c2; }
html[data-theme="dark"] .platform-note svg { fill: #a5b0c2; }
html[data-theme="dark"] .has-screenshot { background: var(--screen-surface); }

/* Factory Forms retains the same native table and input hierarchy. */
html[data-theme="dark"] .forms-preview {
  background: var(--screen-surface);
  border-color: var(--screen-border);
  box-shadow: none;
}
html[data-theme="dark"] .form-window-bar { background: var(--screen-toolbar); }
html[data-theme="dark"] .preview-tabs { border-bottom-color: var(--line); }
html[data-theme="dark"] .preview-tabs button { color: #a6b3c7; }
html[data-theme="dark"] .preview-tabs button[aria-selected="true"] {
  color: #a7c5ff;
  border-bottom-color: #8db2ff;
}
html[data-theme="dark"] .planning-heading > span {
  color: #b2bfd3;
  border-color: #3b4553;
}
html[data-theme="dark"] .planning-meta { color: #a7b5cb; }
html[data-theme="dark"] .plan-state { color: #a6c4ff; background: #273b57; }
html[data-theme="dark"] .planning-table thead { color: #a7b7cf; }
html[data-theme="dark"] .planning-table th,
html[data-theme="dark"] .planning-table td { border-bottom-color: #333b48; }
html[data-theme="dark"] .planning-table tbody th { color: #c1ccdc; }
html[data-theme="dark"] .planning-table td { color: #c8d3e3; }
html[data-theme="dark"] .planning-table td.positive { color: #89c9b8; }
html[data-theme="dark"] .planning-table td > span {
  background: #293d5c;
  box-shadow: inset 0 0 0 1px #425b7f;
  color: #bfd4ff;
}
html[data-theme="dark"] .form-note { background: #252d38; color: #bcc9dc; }
html[data-theme="dark"] .note-symbol { color: #a5c0e6; }
html[data-theme="dark"] .form-note div > span { color: #a8b8cf; }
html[data-theme="dark"] .form-preview-footer {
  background: #20252d;
  border-top-color: var(--line);
  color: #a8b6cc;
}
html[data-theme="dark"] .compatibility { color: #a5adbb; }
html[data-theme="dark"] .compatibility strong { color: #d0d7e3; }
html[data-theme="dark"] .input-demo > div > span,
html[data-theme="dark"] .input-pair > div > span { color: #aabbd3; }
html[data-theme="dark"] .demo-field {
  background: #242c37;
  border-color: #435168;
  color: #c9d5e6;
}
html[data-theme="dark"] .demo-validation { color: #8ac9bb; }

/* Qlik chart previews keep their blue data marks on quieter graphite panels. */
html[data-theme="dark"] .extensions-section { background: var(--soft); }
html[data-theme="dark"] .extension-card { background: var(--screen-surface); border-color: var(--screen-border); }
html[data-theme="dark"] .extension-visual {
  background: linear-gradient(160deg, #222831, #1c242f);
  border-bottom-color: #343e4d;
}
html[data-theme="dark"] .chart-tabs { background: #2a3443; }
html[data-theme="dark"] .chart-tabs button { color: #acbdd5; }
html[data-theme="dark"] .chart-tabs button[aria-selected="true"] {
  background: #465b78;
  color: #f3f6fc;
  box-shadow: none;
}
html[data-theme="dark"] .flow-labels,
html[data-theme="dark"] .chart-visual-footer,
html[data-theme="dark"] .chart-visual-footer > span:last-child,
html[data-theme="dark"] .extension-type { color: #acbbd0; }
html[data-theme="dark"] #parallel-chart g[stroke="#dae4f2"] { stroke: #46566e; }
html[data-theme="dark"] #parallel-chart g[fill="#d2def0"] { fill: #7d94b6; }
html[data-theme="dark"] .feature-tags span { color: #bdcadd; border-color: #435066; }
html[data-theme="dark"] .gantt-title { color: #c4d0e3; }
html[data-theme="dark"] .gantt-months,
html[data-theme="dark"] .gantt-row > span,
html[data-theme="dark"] .gantt-key { color: #aebfd7; }
html[data-theme="dark"] .gantt-row .gantt-group { color: #d2dcec; }
html[data-theme="dark"] .gantt-row > div {
  border-left-color: #394456;
  background: repeating-linear-gradient(to right, transparent 0, transparent calc(33.333% - 1px), #394456 calc(33.333% - 1px), #394456 33.333%);
}
html[data-theme="dark"] .gantt-bar { background: #3a5070; }
html[data-theme="dark"] .gantt-bar::after { background: #8db5ef; }
html[data-theme="dark"] .gantt-bar.summary { background: #94b9ff; }
html[data-theme="dark"] .gantt-bar.cyan { background: #82cdda; }
html[data-theme="dark"] .gantt-key i { background: #8db5ef; }
html[data-theme="dark"] .gantt-key span:last-child i { background: #3a5070; }

/* Brand, contact, and site furniture. */
html[data-theme="dark"] .brand-composition::before {
  background: radial-gradient(ellipse, #27496947, transparent 68%);
}
html[data-theme="dark"] .contact-section { background: #1a2029; }
html[data-theme="dark"] .contact-layout > div > p,
html[data-theme="dark"] .contact-layout .contact-placeholder > p { color: #a9b4c6; }
html[data-theme="dark"] .contact-placeholder { border-color: #3a465a; }
html[data-theme="dark"] .contact-icon { color: #a2bce4; }
html[data-theme="dark"] .contact-domain { color: #a7c2ea; }
html[data-theme="dark"] .site-footer > span,
html[data-theme="dark"] .site-footer > a:last-of-type,
html[data-theme="dark"] .site-footer > p,
html[data-theme="dark"] .footer-privacy { color: #a4afc0; }
html[data-theme="dark"] .site-footer > p { border-top-color: var(--line); }

/* Dialogs and privacy controls are readable before any interaction. */
html[data-theme="dark"] dialog {
  background: #191f28;
  border-color: #3b485c;
  box-shadow: 0 12px 48px #00000055;
}
html[data-theme="dark"] dialog::backdrop { background: #070b12b8; }
html[data-theme="dark"] .dialog-close { background: #344256; color: #d0ddef; }
html[data-theme="dark"] .dialog-heading p,
html[data-theme="dark"] .dialog-caption { color: #acbbd1; }
html[data-theme="dark"] .cookie-notice {
  background: rgba(34, 40, 49, .97);
  border-color: #465165;
  box-shadow: 0 6px 24px #00000030;
}
html[data-theme="dark"] .cookie-notice > p { color: #c0ccdf; }
html[data-theme="dark"] .cookie-actions > a { color: #b3cbf1; }
html[data-theme="dark"] .privacy-intro,
html[data-theme="dark"] .privacy-page section p { color: #b0bdd1; }
html[data-theme="dark"] .privacy-date { color: #a2b0c6; }
html[data-theme="dark"] .privacy-page code { background: #2a374b; color: #d2dff2; }
html[data-theme="dark"] .privacy-page + .site-footer { border-top-color: var(--line); }