/* Light-only product surfaces: porcelain scenes, paper interfaces, satin hardware.
   Composition and animation remain in the existing section stylesheets. */
:root:root :is(.features, .process) {
  --icon-front: var(--lt-accent);
  --icon-back: #a4addb;
  color: var(--lt-ink);
}

/* The editorial grid stays quiet; depth belongs to the interfaces inside it. */
:root:root .features__grid {
  background: var(--lt-line);
  border-color: var(--lt-line);
}
:root:root .feature {
  background: var(--lt-surface);
}
:root:root .feature__visual {
  background: radial-gradient(ellipse 72% 70% at 50% 0%, #f4f7fb, transparent 95%), #fff;
}
:root:root .feature h3 {
  color: var(--lt-ink);
}
:root:root .feature p {
  color: var(--lt-secondary);
}
:root:root .feature-icon.duotone-icon {
  color: var(--lt-accent);
  filter: none;
}
:root:root .feature__badge {
  background: var(--lt-accent-wash);
  color: var(--lt-accent-hover);
  box-shadow: none;
}

/* Sale notifications and the integration search share the same paper finish. */
:root:root :is(.sale-notice, .integration-picker) {
  color: var(--lt-ink);
  background: var(--lt-surface);
  border-color: var(--lt-line);
  box-shadow: var(--lt-shadow);
}
:root:root .sale-notice strong {
  color: var(--lt-ink);
}
:root:root :is(.sale-notice small, .sale-notice time) {
  color: var(--lt-muted);
}
:root:root .integration-picker__search {
  background: var(--lt-soft);
  box-shadow: inset 0 0 0 1px var(--lt-line);
}
:root:root .integration-picker__search.is-resolved {
  background: var(--lt-accent-wash);
  box-shadow: inset 0 0 0 1px #daddf6;
}
:root:root .integration-picker__search svg {
  color: var(--lt-accent);
}
:root:root .integration-picker__search > .search-typed {
  background: none;
  color: var(--lt-ink);
}
:root:root .search-caret {
  background: var(--lt-accent);
}
:root:root .integration-picker__results > small {
  color: var(--lt-muted);
}
:root:root .integration-result {
  color: var(--lt-ink);
}
:root:root .integration-result small {
  color: var(--lt-muted);
}
:root:root .integration-results-stage .integration-result.is-match {
  background: var(--lt-accent-wash);
  border-color: #daddf6;
}

/* Stacked steps: a white shell, a recessed slate scene, one shadow system. */
:root:root .process__steps {
  color: var(--lt-muted);
}
:root:root .process__steps > .is-current {
  color: var(--lt-accent);
}
:root:root .process__steps > i {
  background: var(--lt-line);
}
:root:root .process-card {
  color: var(--lt-ink);
  background: var(--lt-surface);
  border-color: var(--lt-line);
  box-shadow: var(--lt-shadow);
}
:root:root .process-card__heading {
  background: var(--lt-surface);
  border-color: var(--lt-line);
}
:root:root .process-card__heading > span {
  color: var(--lt-accent);
}
:root:root .process-card h3 {
  color: var(--lt-ink);
}
:root:root .process-card__heading p {
  color: var(--lt-secondary);
}
:root:root .process-scene {
  background: var(--lt-soft);
  border-color: var(--lt-line);
}
:root:root .process-scene::before {
  background-image: radial-gradient(#cad3e0 .6px, transparent .6px);
  opacity: .4;
}
:root:root :is(.process-app, .process-invoice) {
  background: var(--lt-surface);
  border-color: var(--lt-line);
  color: var(--lt-ink);
  box-shadow: var(--lt-shadow);
}
:root:root :is(.process-app__bar, .process-integration, .process-app__footer, .process-invoice__top, .process-invoice__status) {
  border-color: var(--lt-line);
}
:root:root :is(.process-app__bar small, .process-integration small, .process-connecting, .process-app__footer) {
  color: var(--lt-muted);
}
:root:root .process-integration strong {
  color: var(--lt-ink);
}
:root:root .process-connected {
  color: var(--lt-success);
}
:root:root .process-connecting::before {
  border-color: #d6dce8;
  border-top-color: var(--lt-accent);
}
:root:root .process-ready-dot {
  background: var(--lt-success);
  box-shadow: none;
}
:root:root .process-success {
  color: var(--lt-secondary);
}

:root:root .process-sale-confirmation {
  color: var(--lt-ink);
  background: var(--lt-surface);
  border-color: var(--lt-line);
  box-shadow: var(--lt-shadow);
}
:root:root .process-sale-confirmation small {
  color: var(--lt-muted);
}
:root:root .process-confirm-icon {
  color: var(--lt-success);
  background: #edf7f2;
  border-color: #d6eadf;
}

/* Invoice paper and delivery confirmations use semantic color only for status. */
:root:root :is(.process-invoice__top > span, .process-invoice__body > small, .process-invoice__total) {
  color: var(--lt-muted);
}
:root:root :is(.process-invoice__top small, .process-invoice__body > strong, .process-invoice__body > span, .process-invoice__total strong) {
  color: var(--lt-ink);
}
:root:root .process-invoice__rule {
  background: var(--lt-line);
}
:root:root .process-invoice__status {
  background: var(--lt-page);
}
:root:root .process-issuing {
  color: var(--lt-accent);
}
:root:root :is(.process-issued, .process-invoice__top i, .process-deliveries i) {
  color: var(--lt-success);
}
:root:root .process-invoice__status > i {
  background: var(--lt-accent);
}
:root:root .process-deliveries > div {
  color: var(--lt-ink);
  background: var(--lt-surface);
  border-color: var(--lt-line);
  box-shadow: var(--lt-shadow);
}
:root:root .process-deliveries > div > span {
  color: var(--lt-accent);
}
:root:root .process-deliveries small {
  color: var(--lt-muted);
}