/* Layout adapters only. Controls inherit the current workbench styles and theme. */
#watermark-mode-switch { display: none; width: auto; margin-left: 8px; flex-shrink: 0; }
body[data-active-feature="watermark-remove"] #watermark-mode-switch:not([hidden]) { display: grid; }
#watermark-mode-switch .choice-button { min-height: 32px; padding: 6px 10px; font-size: 13px; font-weight: 500; }
@layer workbench-visibility {
  #watermark-workspace[hidden] { display: none !important; }
  body.watermark-add-mode #task-panel > .task-body > :is(.upload-column,.settings-column,.preview-column) { display: none !important; }
  body.watermark-add-mode #task-panel :is(#preview-kicker,#mobile-merchant-feature-showcase) { display: none !important; }
}
@layer desktop-fixed-rails {
  #watermark-workspace:not([hidden]) { display: contents !important; }
  html body[data-active-feature="watermark-remove"] #task-panel .task-title-row { justify-content: flex-start !important; gap: 8px !important; flex-wrap: wrap !important; }
  html body[data-active-feature="watermark-remove"] #task-panel #preview-title { flex: 0 0 auto !important; order: 0 !important; }
  html body[data-active-feature="watermark-remove"] #task-panel #watermark-mode-switch { order: 1 !important; margin: 0 !important; }
  html body[data-active-feature="watermark-remove"] #task-panel .task-title-row > [data-clear-feature-settings] { order: 2 !important; margin-left: auto !important; }
  html:not([data-mobile-workbench="true"]) body.watermark-add-mode #task-panel #watermark-workspace > .preview-column { grid-row: 1 / 5 !important; display: flex !important; }
  html:not([data-mobile-workbench="true"]) body.watermark-add-mode #task-panel #watermark-workspace .wm-preview-card { display: flex !important; flex-direction: column !important; width: 100% !important; padding: 18px !important; }
  html body.watermark-add-mode #task-panel #watermark-workspace .wm-footer { display: block !important; width: 100% !important; }
  html body.watermark-add-mode #task-panel #watermark-workspace .wm-actions { width: 100% !important; }
}
#watermark-workspace [hidden] { display: none !important; }
#watermark-workspace .wm-column { min-width: 0; }
#watermark-workspace .wm-upload { position: relative; cursor: pointer; }
#watermark-workspace .wm-upload input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
#watermark-workspace .wm-upload:focus-within { outline: 2px solid var(--purple); outline-offset: 2px; }
#watermark-workspace .wm-hint { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; margin: 8px 0; overflow-wrap: anywhere; }
#watermark-workspace .wm-stage { flex: 1; min-height: 200px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
#watermark-workspace canvas { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; touch-action: none; cursor: crosshair; }
#watermark-workspace [data-wm-empty] { color: var(--muted); font-size: 13px; font-weight: 400; }
#watermark-workspace .wm-images { flex: 0 0 auto; max-height: 180px; overflow: auto; }
#watermark-workspace .wm-image { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
#watermark-workspace .wm-image .choice-button { flex: 1; text-align: left; overflow-wrap: anywhere; min-width: 0; font-size: 13px; font-weight: 500; }
#watermark-workspace .wm-footer { min-width: 0; }
#watermark-workspace .wm-footer p { font-size: 12px; font-weight: 400; color: var(--muted); margin: 0 0 6px; overflow-wrap: anywhere; }
#watermark-workspace .wm-actions { display: grid; grid-template-columns: 1fr; gap: 6px; }
#watermark-workspace progress { width: 100%; accent-color: var(--purple); height: 4px; }
html[data-mobile-workbench="true"] #watermark-workspace .wm-preview-card { display: flex; flex-direction: column; min-height: 280px; }
html[data-mobile-workbench="true"] #watermark-workspace .wm-stage { min-height: 240px; }
html[data-mobile-workbench="true"] #watermark-workspace canvas { max-height: 400px; }


#watermark-workspace .wm-settings { display: grid; gap: 12px; }
#watermark-workspace .view-angle-row output { font-weight: 500; }
#watermark-workspace [data-wm-text-fields] { display: grid; gap: 12px; }

/* Compact content within the existing settings rail. */
#watermark-workspace .extra-prompt-box { min-height: 0; padding: 0; background: transparent; border: 0; }
#watermark-workspace [data-wm-setting="text"] { width: 100%; height: 40px; min-height: 40px; padding: 10px 12px; border: 1px solid var(--border, #ddd9ee); border-radius: 12px; background: var(--card, #fff); color: inherit; font: inherit; font-size: 14px; box-sizing: border-box; }
#watermark-workspace .wm-advanced, #watermark-workspace .wm-custom-color { font-size: 13px; font-weight: 500; color: var(--muted); }
#watermark-workspace summary { cursor: pointer; padding: 8px 0; }
#watermark-workspace .wm-advanced-content {
  display: grid;
  gap: 12px;
  margin-top: 8px;
  padding: 12px;
  border: 1px solid var(--free-control-line, var(--border, #dce5f1));
  border-radius: 12px;
  background: var(--free-control-surface, var(--card, #f8fafc));
}
#watermark-workspace .wm-upload-populated { min-height: 48px !important; height: auto !important; padding: 12px !important; }
#watermark-workspace .wm-upload-populated :is(.upload-icon, small) { display: none; }
#watermark-workspace .wm-images { display: flex; gap: 10px; overflow-x: auto; max-height: 116px; padding: 8px 0; }
#watermark-workspace .wm-image { flex: 0 0 76px; display: flex; flex-direction: column; margin: 0; gap: 3px; }
#watermark-workspace .wm-image .choice-button { width: 76px; height: 76px; min-height: 76px; padding: 4px; position: relative; }
#watermark-workspace .wm-image img { width: 100%; height: 100%; object-fit: contain; border-radius: 6px; }
#watermark-workspace .wm-image .choice-button span { position: absolute; right: 5px; bottom: 4px; padding: 0 4px; background: var(--card, #fff); color: var(--text, #333); border-radius: 4px; font-size: 12px; font-weight: 500; }
#watermark-workspace [data-wm-preview-info] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

#watermark-workspace .wm-field { display: grid; gap: 8px; }
html body #task-panel #watermark-workspace .wm-field-label { color: var(--text, #303646); font-size: var(--aotu-type-label-size); font-weight: 500; line-height: var(--aotu-type-label-leading); }
html body #task-panel #watermark-workspace .wm-settings .choice-button { font-size: var(--aotu-type-control-size); font-weight: 500; line-height: var(--aotu-type-control-leading); }
html body #task-panel #watermark-workspace .view-angle-row > span { color: var(--muted); font-weight: 500; }

html body #task-panel #watermark-workspace .wm-field-label { color: var(--text, #303646) !important; font-weight: 500 !important; }
html body #task-panel #watermark-workspace .view-angle-row > span { color: var(--muted) !important; }
#watermark-workspace .wm-field > .choice-grid { border: 0; background: transparent; box-shadow: none; gap: 8px; }
#watermark-workspace .wm-field > .choice-grid .choice-button { min-height: 40px; padding: 8px 10px; text-align: center; }

/* Remove shared segmented-group surfaces, retaining individual buttons. */
html body[data-active-feature="watermark-remove"] #task-panel :is(#watermark-mode-switch, #watermark-workspace .choice-grid) { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
html body[data-active-feature="watermark-remove"] #task-panel :is(#watermark-mode-switch, #watermark-workspace .choice-grid)::before,
html body[data-active-feature="watermark-remove"] #task-panel :is(#watermark-mode-switch, #watermark-workspace .choice-grid)::after { content: none !important; }
html body[data-active-feature="watermark-remove"] #task-panel #watermark-workspace .swatch-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
html body[data-active-feature="watermark-remove"] #task-panel #watermark-workspace .swatch-button { font-size: 12px !important; font-weight: 500 !important; }

#watermark-workspace .wm-images { width: 100%; max-width: 100%; min-width: 0; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; box-sizing: border-box; }
#watermark-workspace .wm-image { min-width: 76px; }

/* Keep uploaded source images inside the existing upload-card layout. */
#watermark-workspace .wm-source-upload { display: flex; flex-direction: column; align-items: stretch; gap: 12px; cursor: default; width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
#watermark-workspace .wm-upload-trigger { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 100px; cursor: pointer; }
#watermark-workspace .wm-upload-trigger .upload-copy { display: grid; gap: 4px; text-align: center; }
#watermark-workspace .wm-source-upload.wm-has-images .wm-upload-trigger { flex-direction: row; justify-content: flex-start; min-height: 48px; }
#watermark-workspace .wm-source-upload.wm-has-images .upload-copy { text-align: left; }
#watermark-workspace .wm-source-upload .wm-images { touch-action: pan-x; user-select: none; cursor: grab; }
#watermark-workspace .wm-image.multi-upload-preview-card { position: relative; overflow: visible; flex: 0 0 76px; width: 76px; min-width: 76px; max-height: 104px; border: 0; background: transparent; }
#watermark-workspace .wm-image.multi-upload-preview-card .choice-button { height: 100px; min-height: 100px; flex: 0 0 100px; overflow: hidden; }
#watermark-workspace .wm-image.multi-upload-preview-card img { height: 100% !important; object-fit: contain !important; background: transparent !important; -webkit-user-drag: none; }
#watermark-workspace .wm-image .upload-stack-delete { position: absolute; top: 0; right: 0; width: 20px; height: 20px; min-height: 20px; padding: 0; border-radius: 50%; z-index: 1; font-size: 13px; font-weight: 500; line-height: 20px; }
#watermark-workspace .wm-logo-upload { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 100px; text-align: left; }
#watermark-workspace .wm-logo-upload .upload-copy { display: grid; gap: 4px; min-width: 0; }
#watermark-workspace .wm-logo-upload .single-upload-preview-strip { grid-column: 3 !important; grid-row: 1 !important; }
#watermark-workspace [data-wm-logo-thumb] { object-fit: contain; pointer-events: none; }
#watermark-workspace [data-wm-logo-thumb]:not([hidden]) { display: block; }
#watermark-workspace .wm-logo-upload input { z-index: 1; }

#watermark-mode-switch.wm-mode-tabs { grid-template-columns: repeat(2, auto); gap: 8px; }
#watermark-mode-switch .wm-mode-tab { appearance: none; padding: 7px 14px; min-height: 34px; border: 1px solid var(--border, #ddd9ee); border-radius: 10px; background: var(--card, #fff); box-shadow: none; color: var(--muted); font-family: inherit; font-size: 14px; font-weight: 500; line-height: 18px; cursor: pointer; transition: color .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease; }
#watermark-mode-switch .wm-mode-tab:hover { color: var(--text, #303646); border-color: #bcb3ff; }
#watermark-mode-switch .wm-mode-tab.selected { color: var(--purple); border-color: var(--purple); background: rgba(91, 75, 255, .1); box-shadow: 0 0 0 1px rgba(91, 75, 255, .08); }
#watermark-mode-switch .wm-mode-tab:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }
#watermark-mode-switch .wm-mode-tab:disabled { cursor: default; opacity: .5; }
#watermark-workspace .wm-preview-images { padding: 8px; touch-action: pan-x; user-select: none; cursor: grab; }

/* Watermark controls follow the existing settings rail spacing and control geometry. */
#watermark-workspace .settings-card > .dynamic-settings { padding-top: 0; }
html body #task-panel #watermark-workspace .wm-field > .choice-grid .choice-button,
html body #task-panel #watermark-workspace .wm-text-effects .choice-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: var(--aotu-type-control-leading) !important;
}
#watermark-workspace .wm-text-effects {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
#watermark-workspace .wm-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#watermark-workspace .wm-text-effects .choice-button {
  min-height: 40px;
  padding: 8px 10px;
  font-size: var(--aotu-type-control-size);
  font-weight: 500;
}
