/* Interface themes only: artwork canvases, source images and exports keep their colors. */
.app-theme-toggle {
  display: inline-flex;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--glass-line);
  border-radius: 14px;
  color: var(--color-ink);
  background: var(--glass-surface-strong);
  cursor: pointer;
  touch-action: manipulation;
}
.app-theme-toggle:hover { background: var(--color-blue-soft); }
.app-theme-toggle:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; }
.site-header-inner > .app-theme-toggle { order: 10; }
.offline-page > .app-theme-toggle { position: fixed; top: max(16px, env(safe-area-inset-top)); right: max(16px, env(safe-area-inset-right)); }
.theme-icon-sun, [data-theme="dark"] .theme-icon-moon { display: none; }
[data-theme="dark"] .theme-icon-sun { display: block; }

:root[data-theme="dark"] {
  color-scheme: dark;
  --azul: #eeeeee;
  --brand-blue-dark: #fafafa;
  --brand-red-dark: #d51f36;
  --color-ink: #ededed;
  --color-muted: #b8b8b8;
  --color-line: #303036;
  --color-panel: #131316;
  --color-page: #09090b;
  --color-surface: #1b1b20;
  --color-blue-soft: #1b2533;
  --color-red-soft: #302027;
  --danger: #ff9ba7;
  --glass-surface: #131316;
  --glass-surface-strong: #1b1b20;
  --glass-line: #303036;
  --glass-shadow: 0 8px 24px #0003;
  --glass-highlight: inset 0 1px 0 #ffffff09;
  --glass-selected: linear-gradient(135deg, #222c3a, #24252f);
  --glass-selected-line: #4e627c;
  --glass-page-background: radial-gradient(ellipse at 10% 0%, #161619 0, transparent 55%), #09090b;
  scrollbar-color: #49494f #09090b;
}
[data-theme="dark"] body { color: var(--color-ink); background: var(--glass-page-background); }
[data-theme="dark"] ::selection { color: #fff; background: #355d88; }

/* Preserve the original logo's transparency without adding a light plaque. */
[data-theme="dark"] .site-brand-logo { padding: 0; border-radius: 0; background: transparent; }
[data-theme="dark"] .format-status.is-available { color: #9ddbb7; background: #18281f; }
[data-theme="dark"] :is(.site-header, .stories-topbar, .app-tabbar, .indoor-mobile-dock) {
  color: var(--color-ink); border-color: var(--glass-line); background: var(--glass-surface);
}
[data-theme="dark"] .app-tabbar a { color: var(--color-muted); }
[data-theme="dark"] .app-tabbar a[aria-current="page"] { color: var(--azul); }
[data-theme="dark"] .app-tabbar a[aria-current="page"] .app-tab-icon,
[data-theme="dark"] .app-tabbar a:active { background: var(--color-blue-soft); }
[data-theme="dark"] :is(.story-workspace, .catalogue-app, .catalogue-content) { background: var(--color-page); }
[data-theme="dark"] :is(.format-card.is-ready, .filter-panel, .product-card, .dialog, .dialog-header,
  .story-mobile-dialog-surface, .story-product-option, .story-background-option, .story-composition-option-card,
  .indoor-panel, .indoor-product, .indoor-selected li, .indoor-background-option) {
  color: var(--color-ink); border-color: var(--glass-line); background: var(--glass-surface);
}
[data-theme="dark"] :is(.story-section-heading h2, .story-mobile-context h1, .story-mobile-export-intro > strong) { color: var(--color-ink); }
[data-theme="dark"] :is(.story-section-heading p, .story-field-hint, .story-mobile-dialog-header p,
  .story-mobile-context > span, .story-mobile-export-intro p) { color: var(--color-muted); }
[data-theme="dark"] #story-mobile-dialog-title { color: var(--color-ink); }
[data-theme="dark"] :is(.story-mobile-dialog-header, #story-mobile-dialog-footer, .format-card-footer) { border-color: var(--glass-line); }
[data-theme="dark"] :is(.story-mobile-dialog, .ean-scanner-overlay) { color: var(--color-ink); }
[data-theme="dark"] :is(.story-section-icon, .format-icon, .format-features li, .ean-camera-button) {
  color: var(--azul); background: var(--color-blue-soft); border-color: var(--glass-line);
}
[data-theme="dark"] :is(.story-mobile-tool, .story-grid-toggle, .story-mobile-header-button,
  .stories-header-actions .tour-launcher, .story-composition-tools .story-workspace-tool-button) {
  color: var(--azul); border-color: var(--glass-line); background: var(--glass-surface-strong);
}
[data-theme="dark"] #story-mobile-close { color: var(--azul); background: var(--color-surface); }
[data-theme="dark"] :is(.story-mobile-tool[aria-pressed="true"], .story-grid-toggle.is-active,
  .story-composition-tools .story-workspace-tool-button[aria-pressed="true"]) {
  color: #fff; border-color: #5686bc; background: #245b97;
}
[data-theme="dark"] .story-composition-tools #story-mobile-auto-layout {
  color: #f5f5f5; border-color: #62618a; background: linear-gradient(135deg, #254e76, #493e68 65%, #613d50);
}
[data-theme="dark"] .story-composition-tools #story-mobile-auto-layout:hover:not(:disabled) {
  background: linear-gradient(135deg, #30618d, #5a4c81 65%, #784a60);
}

/* Fields and their wrappers share the dark surface, including mobile offer dialogs. */
[data-theme="dark"] :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]), textarea, select) {
  color: var(--color-ink); background-color: var(--color-surface); border-color: var(--glass-line);
}
[data-theme="dark"] :is(input, textarea)::placeholder { color: #a6a6a6; opacity: 1; }
[data-theme="dark"] :is(.search-field, .story-search-field, .story-price-input, .story-price-input > span,
  .story-free-text-input, .ean-launch-button, .pwa-install-button) {
  color: var(--color-ink); border-color: var(--glass-line); background: var(--color-surface);
}
[data-theme="dark"] :is(#ean-input, #ean-format) { color: var(--color-ink); background: var(--color-surface); border-color: var(--glass-line); }
[data-theme="dark"] .story-price-input.is-missing { border-color: #b56a7a; background: var(--color-red-soft); }
[data-theme="dark"] :is(.story-price-field.is-disabled .story-price-input, .story-price-input input:disabled) { color: var(--color-muted); background: var(--color-page); }
[data-theme="dark"] :is(.story-background-option.is-selected, .story-product-option.is-selected,
  .story-composition-input:checked + .story-composition-option-card, .indoor-product[aria-pressed="true"]) {
  border-color: var(--glass-selected-line); background: var(--glass-selected);
}
[data-theme="dark"] .story-product-option.is-secondary-selected { border-color: #b56a7a; background: var(--color-red-soft); }
[data-theme="dark"] :is(#story-mobile-status, .app-navigation-message) {
  color: var(--color-muted); border-color: var(--glass-line); background: var(--color-surface);
}
[data-theme="dark"] :is(.is-error, #story-mobile-status.is-error, .ean-scanner-status.is-error) { color: var(--danger) !important; }
[data-theme="dark"] :is(#story-mobile-canvas-status, #story-mobile-status.is-error) { color: var(--danger); background: var(--color-red-soft); border-color: #774454; }

/* Keep white labels readable on filled blue actions after changing text tokens. */
[data-theme="dark"] :is(.studio-primary-action, .pwa-retry-button, .indoor-steps [aria-current="step"] span) { color: #fff; background: #205d9f; }
[data-theme="dark"] .studio-hero-actions > a:first-child { color: #fff; background: #205d9f; }
[data-theme="dark"] .studio-hero-actions > a:nth-child(2) { color: var(--azul); background: var(--color-blue-soft); border-color: var(--glass-line); }
[data-theme="dark"] .studio-hero-actions > a:nth-child(3) { color: #ffabb9; background: var(--color-red-soft); border-color: #684351; }
[data-theme="dark"] .studio-hero-actions > .ean-launch-button { color: var(--azul); background: var(--color-surface); border-color: var(--glass-line); }
[data-theme="dark"] .studio-hero-actions.home-create-actions > .studio-primary-action { color: #fff; background: #205d9f; border-color: #3277bd; }
[data-theme="dark"] .studio-hero-help .pwa-install-button { background: var(--color-surface); }
[data-theme="dark"] .is-mobile-editor #story-mobile-panel-export .story-png-button { color: var(--azul); border-color: var(--glass-line); background: var(--color-blue-soft); }
[data-theme="dark"] .tour-card[data-mode] { background: linear-gradient(180deg, #232329, transparent 200px), var(--glass-surface-strong); }
[data-theme="dark"] .tour-dialog::backdrop { background: #030a12a6; }
[data-theme="dark"] .app-navigation-progress { background: #203f3d; }
[data-theme="dark"] .app-navigation-progress::after { background: #63c6b7; }

[data-theme="dark"] .pwa-launch { color: var(--color-ink); background: var(--color-page); }
[data-theme="dark"] .pwa-launch-glow-blue { background: radial-gradient(circle, #18212d, transparent 70%); }
[data-theme="dark"] .pwa-launch-glow-red { background: radial-gradient(circle, #281b22, transparent 70%); }
[data-theme="dark"] :is(.pwa-launch-tagline, .pwa-launch-footer) { color: var(--color-muted); }
[data-theme="dark"] .pwa-launch-orbit { border-color: #688bb333; }
[data-theme="dark"] .pwa-launch-orbit::after { border-color: #688bb319; }
[data-theme="dark"] .pwa-launch-track { background: #303036; }

[data-theme="dark"] :is(.product-dialog, .dialog-footer, .ean-scanner-dialog, .empty-state,
  .product-open-button, .story-transform-actions .ghost-button, .indoor-scenes button) {
  color: var(--color-ink); background: var(--glass-surface); border-color: var(--glass-line);
}
[data-theme="dark"] :is(.product-image, .product-image-frame, .image-preview) { background: var(--color-surface); }
[data-theme="dark"] .story-product-option-image img { mix-blend-mode: normal; }
[data-theme="dark"] .image-placeholder { color: var(--color-muted); background: var(--color-surface); }
[data-theme="dark"] :is(.badge.inactive, .danger-button, .toast.error, .ean-scanner-status.is-error) {
  color: var(--danger); background: var(--color-red-soft); border-color: #774454;
}
[data-theme="dark"] .toast:not(.error) { color: var(--color-ink); background: var(--color-blue-soft); }
[data-theme="dark"] .story-search-field:focus-within { background: var(--color-surface); }
[data-theme="dark"] :is(.story-composition-indicator, .story-anchor-switch) { background: var(--color-page); }
[data-theme="dark"] :is(.is-ready .format-card-footer a, .catalogue-header .workspace-actions #new-product-button,
  #catalogue-filter-count, .skip-link),
[data-theme="dark"] .indoor-product[aria-pressed="true"]::after { color: #fff; background: #205d9f; }
[data-theme="dark"] .is-ready .format-card-footer a:hover { background: #2c70b8; }
[data-theme="dark"] .indoor-product-views button[aria-pressed="true"] { color: var(--azul); background: var(--color-surface); }
[data-theme="dark"] .skeleton { background: linear-gradient(110deg, #1b1b20 8%, #29292f 18%, #1b1b20 33%); background-size: 200% 100%; }
[data-theme="dark"] .category-chip.is-active { color: var(--brand-blue-dark); border-color: var(--glass-selected-line); background: var(--glass-selected); }
[data-theme="dark"] .studio-hero { background: linear-gradient(115deg, #1c1c2080, #17171b40), var(--glass-surface); }

@media (max-width: 900px) {
  [data-theme="dark"] body:is(.home-page, .catalogue-page, .is-mobile-editor) { background: var(--color-page); }
  [data-theme="dark"] .is-mobile-editor .story-workspace { background: var(--color-page); }
  [data-theme="dark"] .is-mobile-editor .story-mobile-dialog-surface { background: var(--glass-surface); }
  [data-theme="dark"] .studio-hero { background: none; }
}
@media (max-width: 420px) {
  .site-header .app-screen-name { font-size: 10px; }
}
