.svg-template-config-textarea {
  font-family: Menlo, Consolas, Monaco, monospace;
  min-height: 520px;
}

.svg-template-wizard {
  box-sizing: border-box;
  max-width: 1180px;
  margin: 20px 0;
}

.svg-template-wizard * {
  box-sizing: border-box;
}

.svg-template-wizard-shell {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(320px, 1fr);
  gap: 24px;
  align-items: start;
}

.svg-template-wizard-form-panel,
.svg-template-wizard-preview-panel {
  background: #fff;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  padding: 18px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.svg-template-step-title {
  margin-top: 0;
}

.svg-template-field {
  display: block;
  margin-bottom: 16px;
}

.svg-template-field-label {
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
}

.svg-template-field input,
.svg-template-field textarea {
  width: 100%;
  max-width: 100%;
  padding: 9px 10px;
  border: 1px solid #c3c4c7;
  border-radius: 4px;
  font: inherit;
}

.svg-template-nav {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.svg-template-button {
  cursor: pointer;
}

.svg-template-svg-wrap {
  width: 100%;
  overflow: auto;
  background: #f6f7f7;
  border: 1px solid #dcdcde;
  border-radius: 6px;
  padding: 12px;
}

.svg-template-preview-svg {
  display: block;
  max-width: 100%;
  height: auto;
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.12);
}

.svg-template-output-label {
  margin: 18px 0 8px;
}

.svg-template-output {
  width: 100%;
  min-height: 180px;
  font-family: Menlo, Consolas, Monaco, monospace;
  font-size: 12px;
  white-space: pre;
}

.svg-template-admin-preview .svg-template-wizard {
  max-width: 1280px;
}

@media (max-width: 800px) {
  .svg-template-wizard-shell {
    grid-template-columns: 1fr;
  }
}

/* Backend SVG Template Designer */
.svg-template-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.svg-template-designer * {
  box-sizing: border-box;
}

.svg-designer-shell {
  display: grid;
  grid-template-columns: 280px minmax(420px, 1fr) 320px;
  gap: 16px;
  align-items: start;
  margin: 14px 0;
}

.svg-designer-card,
.svg-designer-stage-wrap {
  background: #fff;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 14px;
}

.svg-designer-card h3 {
  margin: 0 0 10px;
}

.svg-designer-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.svg-inspector-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.svg-inspector-field {
  display: block;
  margin: 0 0 10px;
}

.svg-inspector-field span {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}

.svg-inspector-field input,
.svg-inspector-field select,
.svg-inspector-field textarea {
  width: 100%;
  max-width: 100%;
}

.svg-designer-stage {
  background: #f0f0f1;
  overflow: auto;
  min-height: 500px;
  padding: 18px;
  border-radius: 6px;
}

.svg-designer-svg {
  display: block;
  width: 100%;
  max-width: 760px;
  height: auto;
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, .18);
}

.svg-designer-object.is-selected .svg-designer-selection-rect {
  stroke: #2271b1;
  stroke-width: .8;
  stroke-dasharray: 2 1;
  fill: rgba(34, 113, 177, .08);
  pointer-events: none;
}

.svg-designer-selection-rect {
  stroke: transparent;
  fill: transparent;
  pointer-events: none;
}

.svg-layer-list {
  display: grid;
  gap: 6px;
}

.svg-layer-row {
  display: grid;
  grid-template-columns: 30px 30px minmax(0, 1fr) 30px 30px 30px;
  gap: 4px;
  align-items: center;
  padding: 6px;
  border: 1px solid #dcdcde;
  border-radius: 4px;
  background: #fff;
}

.svg-layer-row.is-selected {
  border-color: #2271b1;
  box-shadow: 0 0 0 1px #2271b1;
}

.svg-layer-name {
  text-align: left;
  min-height: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.svg-layer-row.is-hidden .svg-layer-name {
  color: #8c8f94;
  text-decoration: line-through;
}

.svg-layer-row.is-locked:not(.is-hidden) .svg-layer-name {
  color: #50575e;
}

.svg-layer-toggle {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 14px !important;
}

.svg-layer-row.is-hidden {
  background: #f6f7f7;
}

.svg-mini-button {
  min-width: 28px;
  padding: 0 6px !important;
}

@media (max-width: 1200px) {
  .svg-designer-shell {
    grid-template-columns: 1fr;
  }
}

.svg-designer-right .svg-designer-card {
  position: sticky;
  top: 32px;
}

.svg-inspector-field input[type="number"] {
  max-width: 100%;
}

.svg-inspector-field textarea {
  min-height: 76px;
  resize: vertical;
}

.svg-designer-card > .svg-inspector-field:last-child {
  margin-bottom: 0;
}

/* Inspector Tabs v0.5.4 */
.svg-inspector-titlebar h3 {
  margin-bottom: 8px;
}

.svg-inspector-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 8px;
  align-items: center;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #f6f7f7;
}

.svg-inspector-summary .description {
  grid-column: 2;
}

.svg-inspector-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #2271b1;
  color: #fff;
  font-size: 11px;
  line-height: 1.4;
  text-transform: uppercase;
}

.svg-inspector-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid #dcdcde;
}

.svg-inspector-tab {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 30px;
  padding: 4px 8px !important;
  border: 1px solid #dcdcde !important;
  border-radius: 6px;
  background: var(--svg-cart-dialog-bg, #fff) !important;
  color: #1d2327 !important;
  text-decoration: none !important;
  font-size: 12px;
}

.svg-inspector-tab.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
  box-shadow: inset 0 -2px 0 #2271b1;
}

.svg-inspector-tab-body {
  min-height: 220px;
}

.svg-inspector-section-label {
  margin: 12px 0 8px;
  padding: 6px 8px;
  border-left: 3px solid #2271b1;
  background: #f6f7f7;
  color: #1d2327;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.svg-inspector-tab-body > .svg-inspector-section-label:first-child {
  margin-top: 0;
}

.svg-inspector-actions {
  display: flex;
  gap: 8px;
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid #dcdcde;
}

.svg-inspector-grid .svg-inspector-field {
  margin-bottom: 8px;
}

.svg-inspector-field span {
  color: #3c434a;
  font-size: 12px;
}

.svg-designer-resize-handle {
  fill: #fff;
  stroke: #2271b1;
  stroke-width: .45;
  vector-effect: non-scaling-stroke;
  pointer-events: all;
}

.svg-designer-resize-handle:hover {
  fill: #2271b1;
}

.svg-resize-n,
.svg-resize-s { cursor: ns-resize; }
.svg-resize-e,
.svg-resize-w { cursor: ew-resize; }
.svg-resize-ne,
.svg-resize-sw { cursor: nesw-resize; }
.svg-resize-nw,
.svg-resize-se { cursor: nwse-resize; }

/* v0.5.6 Preset text choices */
.svg-preset-editor {
  display: grid;
  gap: 10px;
}

.svg-preset-editor-head,
.svg-preset-item-top {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}

.svg-preset-item {
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 8px;
}

.svg-template-preset-wrap {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin: 8px 0 10px;
}

.svg-template-preset-track {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding: 4px 2px 10px;
  -webkit-overflow-scrolling: touch;
}

.svg-template-preset-card {
  flex: 0 0 260px;
  min-width: 260px;
  scroll-snap-align: start;
  text-align: left;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fff;
  padding: 12px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

.svg-template-preset-card strong {
  display: block;
  margin-bottom: 6px;
  color: #1d2327;
}

.svg-template-preset-card-text {
  display: block;
  overflow: visible;
  color: #50575e;
  font-size: 12px;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: normal;
  overflow-wrap: break-word;
}

.svg-template-preset-card.is-selected {
  border-color: #2271b1;
  box-shadow: 0 0 0 2px rgba(34,113,177,.18);
}

.svg-template-preset-arrow {
  min-width: 34px;
  height: 34px;
  padding: 0 !important;
  border-radius: 50%;
}

@media (max-width: 782px) {
  .svg-template-preset-wrap {
    grid-template-columns: minmax(0, 1fr);
  }
  .svg-template-preset-arrow {
    display: none !important;
  }
  .svg-template-preset-card {
    flex-basis: 78%;
  }
}

.svg-inspector-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.svg-inspector-field-head span {
  margin-bottom: 0;
}

.svg-inspector-field-tools {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.svg-preview-icon-button {
  min-width: 30px;
  padding: 0 8px !important;
}

.svg-preview-icon-button.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
}

.svg-inspector-preview-status {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 6px;
}

.svg-inspector-preview-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eaf3fb;
  color: #0a4b78;
  font-size: 12px;
  line-height: 1.4;
}

.svg-preset-item.is-previewing {
  border-color: #2271b1;
  box-shadow: 0 0 0 2px rgba(34,113,177,.12);
}

.svg-designer-text-guide {
  fill: rgba(34, 113, 177, 0.04);
  stroke: #2271b1;
  stroke-dasharray: 1.6 1.2;
  pointer-events: none;
}


/* Fontverwaltung v0.7.0 */
.svg-font-manager-toolbar {
  margin: 16px 0;
}

.svg-font-card {
  background: #fff;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  padding: 14px;
  margin: 14px 0;
  max-width: 1100px;
}

.svg-font-card-head,
.svg-font-variants-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.svg-font-grid,
.svg-font-variant-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(160px, 1fr) minmax(220px, 2fr) auto;
  gap: 10px;
  align-items: end;
}

.svg-font-grid {
  grid-template-columns: minmax(120px, 180px) minmax(160px, 1fr) minmax(220px, 2fr);
  margin-bottom: 14px;
}

.svg-font-field {
  display: block;
}

.svg-font-field span {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}

.svg-font-field input,
.svg-font-field select {
  width: 100%;
  max-width: 100%;
}

.svg-font-variants {
  border-top: 1px solid #dcdcde;
  padding-top: 12px;
}

.svg-font-variant-row {
  margin-bottom: 10px;
}

.svg-font-variant-actions {
  display: flex;
  gap: 6px;
}

@media (max-width: 900px) {
  .svg-font-grid,
  .svg-font-variant-row {
    grid-template-columns: 1fr;
  }
}

/* Font Manager v0.7.4 */
.svg-font-intro {
  max-width: 1100px;
  margin: 14px 0;
  padding: 12px 14px;
  border-left: 4px solid #2271b1;
  background: #f0f6fc;
}

.svg-font-title-wrap {
  display: grid;
  gap: 3px;
}

.svg-font-head-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.svg-font-grid-main {
  align-items: start;
}

.svg-font-status {
  margin: 8px 0 12px;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #c3c4c7;
  background: #f6f7f7;
}

.svg-font-status.is-success {
  border-color: #8cbd8c;
  background: #f0fff0;
  color: #135e13;
}

.svg-font-status.is-error {
  border-color: #d63638;
  background: #fcf0f1;
  color: #8a2424;
}

.svg-font-variant-meta {
  grid-column: 1 / -1;
  color: #646970;
  font-size: 12px;
  margin-top: -4px;
}

.svg-font-variant-row .svg-font-status {
  grid-column: 1 / -1;
  margin: 0 0 4px;
}

/* Fontverwaltung v0.8.0 flat font files */
.svg-font-list {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.svg-font-card-flat .svg-font-grid-main {
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.svg-font-intro {
  background: #f6f7f7;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  padding: 10px 12px;
  margin: 10px 0 14px;
}

.svg-font-title-wrap {
  display: grid;
  gap: 3px;
}

.svg-font-head-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.svg-font-status {
  margin: 10px 0;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #dcdcde;
}

.svg-font-status.is-success {
  border-color: #00a32a;
  background: #edfaef;
  color: #005c12;
}

.svg-font-status.is-error {
  border-color: #d63638;
  background: #fcf0f1;
  color: #8a2424;
}

.svg-page-tabs,
.svg-template-page-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.svg-page-tab.is-active,
.svg-template-page-tab.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
  box-shadow: inset 0 -2px 0 #2271b1;
}

/* v0.9.1 left tab navigation */
.svg-left-tabs-card > h3 {
  margin-bottom: 10px;
}

.svg-left-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid #dcdcde;
}

.svg-left-tab {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 30px;
  padding: 4px 8px !important;
  border: 1px solid #dcdcde !important;
  border-radius: 6px;
  background: #fff !important;
  color: #1d2327 !important;
  text-decoration: none !important;
  font-size: 12px;
}

.svg-left-tab.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
  box-shadow: inset 0 -2px 0 #2271b1;
}

.svg-left-tab-body .svg-designer-card {
  border: 0;
  padding: 0;
  margin: 0;
  box-shadow: none;
}

.svg-left-tab-body .svg-designer-card > h3 {
  display: none;
}

.svg-left-panel-section {
  display: grid;
  gap: 10px;
}

.svg-page-tabs {
  display: grid;
  gap: 6px;
}

.svg-page-row {
  display: grid;
  grid-template-columns: 1fr 32px 32px;
  gap: 4px;
  align-items: center;
  padding: 6px;
  border: 1px solid #dcdcde;
  border-radius: 6px;
  background: #fff;
}

.svg-page-row.is-active {
  border-color: #2271b1;
  box-shadow: 0 0 0 1px #2271b1;
  background: #f6fbff;
}

.svg-page-name {
  text-align: left;
  min-height: 28px;
  text-decoration: none;
}

/* v0.9.3 Wizard mobile-first: preview above input */
.svg-template-wizard-shell {
  grid-template-columns: 1fr;
  gap: 18px;
}

.svg-template-wizard-preview-panel {
  order: 1;
}

.svg-template-wizard-form-panel {
  order: 2;
}

.svg-template-admin-preview .svg-template-wizard,
.svg-template-wizard {
  max-width: 980px;
}

.svg-template-image-upload-field .description {
  margin: 6px 0 8px;
}

.svg-template-image-controls {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.svg-template-range-row {
  display: grid;
  grid-template-columns: 80px minmax(120px, 1fr) 52px;
  gap: 8px;
  align-items: center;
}

.svg-template-range-row span {
  font-weight: 600;
}

.svg-template-range-row input[type="range"] {
  width: 100%;
}

.svg-template-range-row em {
  font-style: normal;
  color: #50575e;
  text-align: right;
}

.svg-template-image-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

@media (max-width: 782px) {
  .svg-template-range-row {
    grid-template-columns: 1fr;
  }
  .svg-template-range-row em {
    text-align: left;
  }
}


/* v1.0.2 image upload editor */
.svg-template-upload-dropzone {
  position: relative;
  display: grid;
  gap: 8px;
  justify-items: start;
  padding: 16px;
  border: 2px dashed #b9c3cf;
  border-radius: 10px;
  background: #f8fafc;
  margin-top: 8px;
}
.svg-template-upload-dropzone.is-dragover {
  border-color: #2271b1;
  background: #eef6ff;
}
.svg-template-upload-dropzone.is-loading::after {
  content: '';
  position: absolute;
  right: 14px;
  top: 14px;
  width: 18px;
  height: 18px;
  border: 2px solid #c3d4e7;
  border-top-color: #2271b1;
  border-radius: 50%;
  animation: svg-template-spin 0.8s linear infinite;
}
@keyframes svg-template-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.svg-template-upload-dropzone strong { font-size: 14px; }
.svg-template-upload-dropzone span { color: #50575e; }
.svg-template-file-input { position: absolute; inset: 0; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.svg-template-upload-status { min-height: 18px; }
.svg-template-image-editor { display: grid; gap: 6px; margin-top: 10px; }
.svg-template-image-editor-frame {
  position: relative;
  width: min(100%, 360px);
  aspect-ratio: 1 / 1;
  border: 1px solid #c3c4c7;
  border-radius: 10px;
  overflow: hidden;
  background: repeating-conic-gradient(#f5f5f5 0% 25%, #fff 0% 50%) 50% / 18px 18px;
}
.svg-template-image-editor-stage { position: absolute; inset: 0; overflow: hidden; touch-action: none; cursor: grab; }
.svg-template-image-editor-stage.is-dragging { cursor: grabbing; }
.svg-template-image-editor-image {
  position: absolute;
  transform-origin: center center;
  user-select: none;
  -webkit-user-drag: none;
  max-width: none;
}
.svg-template-image-editor-empty {
  position: absolute; inset: 0; display: grid; place-items: center; color: #50575e; font-weight: 600; background: rgba(255,255,255,.6);
}
.svg-template-image-editor-caption { color: #50575e; font-size: 12px; }

.svg-template-image-controls-title {
  font-weight: 700;
  margin: 2px 0;
}
.svg-template-range-input {
  appearance: auto;
  display: block;
}
.svg-template-image-editor-center {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  margin-top: -7px;
  border-radius: 50%;
  border: 1px solid rgba(34,113,177,.4);
  background: rgba(255,255,255,.65);
  pointer-events: none;
}
.svg-template-image-editor-center::before,
.svg-template-image-editor-center::after {
  content: '';
  position: absolute;
  background: rgba(34,113,177,.45);
}
.svg-template-image-editor-center::before {
  left: 50%;
  top: -8px;
  width: 1px;
  height: 30px;
  margin-left: -0.5px;
}
.svg-template-image-editor-center::after {
  top: 50%;
  left: -8px;
  height: 1px;
  width: 30px;
  margin-top: -0.5px;
}
.svg-template-image-editor-handles {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.svg-template-image-editor-handle {
  position: absolute;
  width: 18px;
  height: 18px;
  margin-left: -9px;
  margin-top: -9px;
  border-radius: 50%;
  border: 2px solid #2271b1;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.18);
  pointer-events: auto;
  cursor: nwse-resize;
}
.svg-template-image-editor-handle.handle-ne,
.svg-template-image-editor-handle.handle-sw {
  cursor: nesw-resize;
}
.svg-template-image-editor-handle.is-active {
  transform: scale(1.08);
}
@media (max-width: 782px) {
  .svg-template-image-editor-handle {
    display: none;
  }
}


/* v1.0.4 visible tools + rotation handle */
.svg-template-image-tools-card {
  display: grid !important;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fff;
}

.svg-template-image-controls-title {
  font-weight: 700;
  font-size: 14px;
}

.svg-template-image-rotate-handle {
  border-color: #d63638;
  cursor: grab;
}

.svg-template-image-rotate-handle::before {
  content: '↻';
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 12px;
  line-height: 1;
  color: #d63638;
}

.svg-template-image-rotate-handle.is-active {
  cursor: grabbing;
}

.svg-template-image-scale-handle::before {
  content: '';
}

.svg-template-image-editor-image {
  transform-origin: center center;
}

@media (max-width: 782px) {
  .svg-template-image-rotate-handle {
    display: none;
  }
}

/* v1.0.5 image editor fixes */
.svg-template-image-tools-card {
  display: grid !important;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fff;
}

.svg-template-image-controls-title {
  font-weight: 700;
  font-size: 14px;
}

.svg-template-image-editor-layer {
  position: absolute;
  width: 0;
  height: 0;
  transform-origin: 0 0;
  pointer-events: none;
}

.svg-template-image-editor-layer .svg-template-image-editor-image {
  position: absolute;
  transform: none !important;
  transform-origin: center center;
}

.svg-template-image-rotate-handle {
  border-color: #d63638;
  cursor: grab;
}

.svg-template-image-rotate-handle::before {
  content: '↻';
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 12px;
  line-height: 1;
  color: #d63638;
}

.svg-template-image-rotate-handle.is-active {
  cursor: grabbing;
}

.svg-template-range-input {
  display: block;
}

/* v1.0.9 mobile text/image editor stability */
.svg-template-image-editor-layer {
  position: absolute;
  width: 0;
  height: 0;
  transform-origin: 0 0;
  pointer-events: none;
}

.svg-template-image-editor-layer .svg-template-image-editor-image,
.svg-template-image-editor-image {
  position: absolute;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  touch-action: none;
}

.svg-template-image-editor-stage {
  touch-action: none;
}


/* v1.0.11 compact upload UI */
.svg-template-upload-compactbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fff;
}
.svg-template-upload-compactinfo {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.svg-template-upload-compactinfo strong {
  font-size: 13px;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-template-upload-compactinfo span {
  font-size: 12px;
  color: #50575e;
}
.svg-template-upload-compactactions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.svg-template-image-upload-field.has-upload .svg-template-upload-status {
  margin-top: 6px;
}
.svg-template-upload-compactbar.is-loading {
  opacity: .75;
}
.svg-template-upload-compactbar[hidden],
.svg-template-upload-dropzone[hidden] {
  display: none !important;
}
@media (max-width: 782px) {
  .svg-template-upload-compactbar {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 9px 10px;
  }
  .svg-template-upload-compactactions {
    width: 100%;
    justify-content: stretch;
  }
  .svg-template-upload-compactactions .button,
  .svg-template-upload-compactactions .button-link-delete {
    flex: 1 1 auto;
    text-align: center;
  }
  .svg-template-image-tools-card {
    gap: 8px;
    margin-top: 10px;
    padding: 10px;
    border-radius: 8px;
  }
  .svg-template-range-row {
    gap: 4px;
  }
  .svg-template-range-row span,
  .svg-template-range-row em {
    font-size: 12px;
  }
  .svg-template-range-input {
    width: 100%;
  }
  .svg-template-image-actions {
    gap: 6px;
  }
  .svg-template-image-actions .button {
    flex: 1 1 auto;
    justify-content: center;
  }
  .svg-template-image-editor {
    gap: 4px;
    margin-top: 8px;
  }
  .svg-template-image-editor-caption {
    font-size: 11px;
  }
}


/* v1.0.12 image upload placement + compact actions */
.svg-template-image-upload-field .svg-template-file-input {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.svg-template-upload-dropzone-compact {
  margin-top: 8px;
  padding: 10px 12px;
  border-width: 1px;
  border-radius: 8px;
}

.svg-template-upload-dropzone-compact strong {
  font-size: 13px;
}

.svg-template-upload-dropzone-compact span {
  font-size: 12px;
}

.svg-template-upload-actionsbar {
  margin-top: 6px;
  padding: 6px 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}

.svg-template-upload-actionsbar .svg-template-upload-compactinfo span {
  display: none;
}

.svg-template-upload-actionsbar .svg-template-upload-compactinfo strong {
  font-size: 12px;
  color: #50575e;
}

.svg-template-upload-actionsbar .svg-template-upload-compactactions .button {
  min-height: 28px;
  line-height: 26px;
  padding: 0 8px;
}

.svg-template-image-upload-field.has-upload .svg-template-upload-status {
  display: none;
}

@media (max-width: 782px) {
  .svg-template-upload-actionsbar {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 4px 0;
  }
  .svg-template-upload-actionsbar .svg-template-upload-compactinfo strong {
    font-size: 11px;
  }
  .svg-template-upload-actionsbar .svg-template-upload-compactactions {
    gap: 6px;
  }
  .svg-template-upload-actionsbar .svg-template-upload-compactactions .button,
  .svg-template-upload-actionsbar .svg-template-upload-compactactions .button-link-delete {
    min-height: 28px;
    line-height: 26px;
    padding: 0 7px;
    font-size: 12px;
  }
}


/* v1.0.15 upload rules + quality warning */
.svg-template-upload-hint {
  display: block;
  color: #646970;
  font-size: 12px;
  line-height: 1.3;
}

.svg-template-quality-warning {
  margin-top: 8px;
  padding: 8px 10px;
  border-left: 3px solid #dba617;
  background: #fff8e5;
  color: #604600;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.4;
}

.svg-template-quality-warning[hidden] {
  display: none !important;
}

@media (max-width: 782px) {
  .svg-template-quality-warning {
    margin-top: 6px;
    padding: 7px 9px;
    font-size: 12px;
  }
}


/* v1.0.16 compact wizard topbar + grouped chevrons */
.svg-template-wizard-topbar {
  position: relative;
  z-index: 3;
  display: grid;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 10px;
  border: 1px solid #dcdcde;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}

.svg-template-wizard-top-main {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}

.svg-template-step-title {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 700;
}

.svg-template-nav-top {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.svg-template-nav-top .button {
  min-height: 30px;
  line-height: 28px;
  padding: 0 10px;
}

.svg-template-page-tabs-top {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1px;
}

.svg-template-page-tabs-top .svg-template-page-tab {
  flex: 0 0 auto;
  min-height: 28px;
  line-height: 26px;
  padding: 0 10px;
}

.svg-template-step-progress {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 1px 0 3px;
}

.svg-template-step-group {
  --page-color: #2271b1;
  flex: 0 0 auto;
  min-width: max-content;
  display: grid;
  gap: 3px;
}

.svg-template-step-group.page-color-0 { --page-color: #2271b1; }
.svg-template-step-group.page-color-1 { --page-color: #46b450; }
.svg-template-step-group.page-color-2 { --page-color: #826eb4; }
.svg-template-step-group.page-color-3 { --page-color: #dba617; }
.svg-template-step-group.page-color-4 { --page-color: #d63638; }
.svg-template-step-group.page-color-5 { --page-color: #00a0d2; }

.svg-template-step-group-label {
  font-size: 10px;
  line-height: 1;
  color: #646970;
  white-space: nowrap;
  padding-left: 2px;
}

.svg-template-step-group-bar {
  height: 3px;
  border-radius: 999px;
  background: var(--page-color);
  opacity: .8;
}

.svg-template-step-chevrons {
  display: flex;
  align-items: stretch;
}

.svg-template-step-chevron {
  position: relative;
  flex: 0 0 auto;
  min-height: 28px;
  line-height: 26px;
  padding: 0 15px 0 12px !important;
  margin: 0 0 0 -1px !important;
  border: 1px solid #c3c4c7 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  background: #f6f7f7 !important;
  color: #1d2327 !important;
  font-size: 12px !important;
  white-space: nowrap;
}

.svg-template-step-chevron:first-child {
  margin-left: 0 !important;
  border-radius: 6px 0 0 6px !important;
}

.svg-template-step-chevron:last-child {
  border-right: 1px solid #c3c4c7 !important;
  border-radius: 0 6px 6px 0 !important;
}

.svg-template-step-chevron::after {
  content: '';
  position: absolute;
  top: -1px;
  right: -9px;
  width: 18px;
  height: 18px;
  border-top: 1px solid #c3c4c7;
  border-right: 1px solid #c3c4c7;
  background: inherit;
  transform: translateY(6px) rotate(45deg);
  z-index: 2;
}

.svg-template-step-chevron:last-child::after {
  display: none;
}

.svg-template-step-chevron.is-complete {
  background: color-mix(in srgb, var(--page-color) 10%, #fff) !important;
}

.svg-template-step-chevron.is-active {
  background: var(--page-color) !important;
  border-color: var(--page-color) !important;
  color: #fff !important;
  font-weight: 700;
  z-index: 4;
}

.svg-template-step-chevron.is-active::after {
  border-color: var(--page-color);
}

@supports not (background: color-mix(in srgb, #000 10%, #fff)) {
  .svg-template-step-chevron.is-complete {
    background: #eef6ff !important;
  }
}

@media (max-width: 782px) {
  .svg-template-wizard-topbar {
    gap: 6px;
    padding: 7px 8px;
    margin-bottom: 8px;
    border-radius: 10px;
  }
  .svg-template-wizard-top-main {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .svg-template-step-title {
    font-size: 13px;
  }
  .svg-template-nav-top {
    justify-content: stretch;
  }
  .svg-template-nav-top .button {
    flex: 1 1 auto;
    min-height: 29px;
    line-height: 27px;
    padding: 0 8px;
    font-size: 12px;
  }
  .svg-template-step-progress {
    gap: 7px;
  }
  .svg-template-step-group-label {
    font-size: 9px;
  }
  .svg-template-step-chevron {
    min-height: 26px;
    line-height: 24px;
    padding: 0 13px 0 10px !important;
    font-size: 11px !important;
  }
  .svg-template-step-chevron::after {
    width: 16px;
    height: 16px;
    right: -8px;
    transform: translateY(5px) rotate(45deg);
  }
}


/* v1.0.17 emoji warning */
.svg-template-emoji-warning {
  margin-top: 6px;
  padding: 7px 9px;
  border-left: 3px solid #dba617;
  background: #fff8e5;
  color: #604600;
  border-radius: 6px;
  font-size: 12px;
  line-height: 1.35;
}
.svg-template-emoji-warning[hidden] {
  display: none !important;
}

/* v1.0.19 per-page bleed / customer visible area guide */
.svg-designer-bleed-guide {
  stroke: #d63638;
  stroke-width: .35;
  stroke-dasharray: 2 1.4;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

/* v1.0.20 layer visibility/lock controls */
@media (max-width: 480px) {
  .svg-layer-row {
    grid-template-columns: 30px 30px minmax(0, 1fr);
  }
  .svg-layer-row .svg-mini-button:nth-last-child(-n+3) {
    margin-top: 4px;
  }
}

/* v1.0.24 backend inspector collapse + clean canvas guides */
.svg-designer-stage-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.svg-designer-stage-toolbar .description {
  margin: 0;
}
.svg-editor-guides-toggle.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
}
.svg-designer-hide-guides .svg-designer-selection-rect,
.svg-designer-hide-guides .svg-designer-resize-handle,
.svg-designer-hide-guides .svg-designer-text-guide,
.svg-designer-hide-guides .svg-designer-bleed-guide,
.svg-designer-hide-guides .svg-designer-placeholder-rect,
.svg-designer-hide-guides .svg-designer-placeholder-label {
  display: none !important;
}
.svg-inspector-collapse-section {
  margin: 10px 0;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.svg-inspector-collapse-head {
  display: flex !important;
  width: 100%;
  align-items: center;
  gap: 7px;
  padding: 8px 10px !important;
  border: 0 !important;
  border-left: 3px solid #2271b1 !important;
  border-radius: 0 !important;
  background: #f6f7f7 !important;
  color: #1d2327 !important;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-decoration: none !important;
  text-align: left;
}
.svg-inspector-collapse-marker {
  display: inline-flex;
  width: 14px;
  justify-content: center;
  color: #50575e;
}
.svg-inspector-collapse-content {
  padding: 10px 10px 0;
}
.svg-inspector-collapse-section.is-collapsed .svg-inspector-collapse-content {
  display: none;
}
.svg-inspector-collapse-content > .svg-inspector-grid:last-child,
.svg-inspector-collapse-content > .svg-inspector-field:last-child,
.svg-inspector-collapse-content > .svg-preset-editor:last-child {
  margin-bottom: 10px;
}
@media (max-width: 782px) {
  .svg-designer-stage-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
}

/* v1.0.26 wizard view editor */
.svg-wizard-views-panel {
  gap: 12px;
}
.svg-wizard-view-actions,
.svg-wizard-view-tools,
.svg-wizard-add-field {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.svg-wizard-view-card {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
}
.svg-wizard-view-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}
.svg-wizard-view-head strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-wizard-view-fields {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid #dcdcde;
}
.svg-wizard-field-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 30px 30px 30px;
  gap: 4px;
  align-items: center;
  padding: 5px;
  border: 1px solid #dcdcde;
  border-radius: 6px;
  background: #f6f7f7;
}
.svg-wizard-field-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.svg-wizard-add-field select {
  min-width: 0;
  flex: 1 1 160px;
}
.svg-template-view-chevrons {
  width: 100%;
  justify-content: center;
  gap: 0;
}
.svg-template-view-tab {
  min-width: 112px;
  text-align: center;
}

/* v1.0.28 fullscreen wizard desktop layout + configurable design */
body.svg-template-wizard-is-fullscreen {
  overflow: hidden;
}

.svg-template-wizard-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 999999;
  width: 100vw;
  height: 100vh;
  margin: 0;
  max-width: none !important;
  background: #fff;
  color: #15110e;
  overflow: auto;
}

.svg-template-wizard-app {
  --svg-wizard-bg: #f6f1ec;
  --svg-wizard-panel: #ffffff;
  --svg-wizard-text: #15110e;
  --svg-wizard-muted: #6f6861;
  --svg-wizard-line: #e6dfd8;
  --svg-wizard-field-bg: #ffffff;
  --svg-wizard-field-text: #15110e;
  --svg-wizard-field-border: #e6dfd8;
  --svg-wizard-field-focus: #8d6e50;
  --svg-wizard-field-radius: 5px;
  --svg-wizard-field-height: 52px;
  --svg-wizard-field-padding-x: 16px;
  --svg-wizard-select-chevron-display: block;
  --svg-wizard-select-chevron-color: #8d6e50;
  --svg-wizard-select-chevron-size: 18px;
  --svg-wizard-select-chevron-right: 14px;
  --svg-wizard-font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --svg-wizard-heading-font-family: Georgia, "Times New Roman", serif;
  --svg-wizard-button-font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --svg-wizard-field-font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --svg-wizard-navigation-font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --svg-wizard-brand: #8d6e50;
  --svg-wizard-button: #c5b29f;
  --svg-wizard-button-text: #fffaf5;
  --svg-wizard-button-padding-x: 24px;
  --svg-wizard-button-padding-y: 14px;
  --svg-wizard-editor-width: 440px;
  --svg-wizard-preview-max-width: 760px;
  --svg-wizard-tablet-preview-max-width: 620px;
  --svg-wizard-desktop-min-width: 1100px;
  --svg-wizard-desktop-min-height: 700px;
  --svg-wizard-preview-shadow: 0 20px 55px rgba(36,27,20,.16);
  --svg-wizard-radius: 8px;
  --svg-wizard-bg-image: none;
  --svg-wizard-header-height: 92px;
  --svg-wizard-tabs-height: 128px;
  --svg-wizard-panel-padding-x: 38px;
  --svg-wizard-panel-padding-top: 46px;
  --svg-wizard-panel-padding-bottom: 24px;
  --svg-wizard-panel-footer-padding-top: 18px;
  --svg-wizard-panel-footer-padding-bottom: var(--svg-wizard-panel-padding-x);
  min-height: 100vh;
  min-height: 100dvh;
  height: max(100vh, var(--svg-wizard-desktop-min-height));
  height: max(100dvh, var(--svg-wizard-desktop-min-height));
  min-width: var(--svg-wizard-desktop-min-width);
  display: grid;
  grid-template-rows: var(--svg-wizard-header-height) minmax(0, 1fr);
  background: #fff;
  color: var(--svg-wizard-text);
  font-family: var(--svg-wizard-font-family, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}

.svg-template-fullscreen-topbar {
  height: var(--svg-wizard-header-height);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 18px;
  padding: 0 22px 0 32px;
  border-bottom: 1px solid var(--svg-wizard-line);
  background: rgba(255,255,255,.94);
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  z-index: 10;
}

.svg-template-fullscreen-topbar-left,
.svg-template-fullscreen-topbar-right {
  display: flex;
  align-items: center;
  gap: 18px;
}

.svg-template-fullscreen-topbar-right {
  justify-content: flex-end;
}

.svg-template-fullscreen-back,
.svg-template-fullscreen-brand {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--svg-wizard-text) !important;
  box-shadow: none !important;
  font-size: 15px;
  font-weight: 500;
  font-family: var(--svg-wizard-font-family, inherit);
  text-decoration: none;
}

.svg-template-fullscreen-brand {
  color: var(--svg-wizard-brand) !important;
}

.svg-template-fullscreen-title {
  margin: 0;
  font-family: var(--svg-wizard-heading-font-family, Georgia, "Times New Roman", serif);
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 600;
  line-height: 1.1;
  text-align: center;
  letter-spacing: .01em;
}

.svg-template-fullscreen-buy,
.svg-template-fullscreen-zip,
.svg-template-fullscreen-next {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: calc(var(--svg-wizard-button-font-size, 16px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 4px);
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  border: 0 !important;
  border-radius: var(--svg-wizard-radius) !important;
  background: var(--svg-wizard-button) !important;
  color: var(--svg-wizard-button-text) !important;
  font-size: 16px;
  font-weight: 500;
  font-family: var(--svg-wizard-button-font-family, inherit);
  box-shadow: 0 8px 22px rgba(125,101,80,.18) !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.svg-template-fullscreen-zip {
  min-height: calc(var(--svg-wizard-button-font-size, 13px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 2px);
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  background: #fff !important;
  color: var(--svg-wizard-brand) !important;
  border: 1px solid var(--svg-wizard-line) !important;
  box-shadow: none !important;
  font-size: 13px;
}

.svg-template-fullscreen-buy:hover,
.svg-template-fullscreen-next:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(125,101,80,.22) !important;
}

.svg-template-fullscreen-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--svg-wizard-editor-width);
}

.svg-template-fullscreen-preview-stage {
  position: relative;
  min-width: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr) var(--svg-wizard-tabs-height);
  background-color: var(--svg-wizard-bg);
  background-image: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.65) 65%, rgba(255,255,255,.2)), var(--svg-wizard-bg-image);
  background-position: center, center;
  background-size: auto, cover;
}

.svg-template-fullscreen-preview-stage::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 12%, rgba(141,110,80,.08), transparent 28%), radial-gradient(circle at 82% 70%, rgba(141,110,80,.1), transparent 32%);
  pointer-events: none;
}

.svg-template-fullscreen-card-area {
  position: relative;
  z-index: 1;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: 42px 112px 20px;
}

.svg-template-fullscreen-svg-wrap {
  width: min(100%, var(--svg-wizard-preview-max-width));
  max-height: calc(100vh - var(--svg-wizard-header-height) - var(--svg-wizard-tabs-height) - 64px);
  display: grid;
  place-items: center;
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}

.svg-template-fullscreen-svg-wrap .svg-template-preview-svg {
  width: auto;
  max-width: 100%;
  max-height: calc(100vh - var(--svg-wizard-header-height) - var(--svg-wizard-tabs-height) - 64px);
  box-shadow: var(--svg-wizard-preview-shadow);
}

.svg-template-fullscreen-arrow {
  position: absolute;
  top: 48%;
  z-index: 3;
  width: 68px;
  height: 68px;
  min-width: 68px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center;
  background: rgba(255,255,255,.94) !important;
  color: var(--svg-wizard-text) !important;
  box-shadow: 0 18px 50px rgba(42,31,23,.12) !important;
  font-size: 42px;
  line-height: 1;
}

.svg-template-fullscreen-arrow-left { left: 40px; }
.svg-template-fullscreen-arrow-right { right: 32px; }

.svg-template-fullscreen-arrow:hover {
  transform: translateY(-1px) scale(1.03);
  background: #fff !important;
}

.svg-template-fullscreen-view-tabs {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 50px 34px;
  overflow: hidden;
}

.svg-template-fullscreen-view-tab-list {
  width: min(930px, 100%);
  min-height: 96px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(140px, 1fr);
  overflow-x: auto;
  background: rgba(255,255,255,.88);
  border-radius: var(--svg-wizard-radius);
  box-shadow: 0 14px 45px rgba(48,35,24,.13);
}

.svg-template-fullscreen-view-tab {
  position: relative;
  min-height: 96px;
  padding: 10px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: transparent !important;
  color: #23201d !important;
  box-shadow: none !important;
  font-size: 14px;
  white-space: normal;
}

.svg-template-fullscreen-view-tab + .svg-template-fullscreen-view-tab::before {
  content: '';
  position: absolute;
  left: 0;
  top: 24px;
  bottom: 24px;
  width: 1px;
  background: var(--svg-wizard-line);
}

.svg-template-fullscreen-view-tab.is-active {
  color: var(--svg-wizard-brand) !important;
  background: rgba(244,239,233,.8) !important;
}

.svg-template-fullscreen-view-tab.is-active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--svg-wizard-brand);
}

.svg-template-fullscreen-view-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  font-size: 26px;
  line-height: 1;
  color: currentColor;
}

.svg-template-fullscreen-view-label {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.svg-template-fullscreen-editor-panel {
  min-height: 0;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--svg-wizard-line);
  border-radius: 0;
  box-shadow: none;
  background: var(--svg-wizard-panel);
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

.svg-template-fullscreen-editor-content {
  min-height: 0;
  overflow-y: auto;
  padding: var(--svg-wizard-panel-padding-top) var(--svg-wizard-panel-padding-x) var(--svg-wizard-panel-padding-bottom);
}

.svg-template-fullscreen-editor-title {
  margin: 0 0 10px;
  font-family: var(--svg-wizard-heading-font-family, Georgia, "Times New Roman", serif);
  font-size: 28px;
  line-height: 1.12;
  font-weight: 600;
}

.svg-template-fullscreen-editor-copy {
  margin: 0 0 28px;
  color: var(--svg-wizard-muted);
  font-size: 13px;
  line-height: 1.5;
}

.svg-template-fullscreen-fields .svg-template-field {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--svg-wizard-line);
}

.svg-template-fullscreen-fields .svg-template-field:last-child {
  border-bottom: 0;
}

.svg-template-fullscreen-fields .svg-template-field-label {
  font-size: 12px;
  color: #1b1714;
}

.svg-template-fullscreen-fields input,
.svg-template-fullscreen-fields textarea,
.svg-template-fullscreen-fields select {
  min-height: var(--svg-wizard-field-height, 52px);
  padding-left: var(--svg-wizard-field-padding-x, 16px);
  padding-right: var(--svg-wizard-field-padding-x, 16px);
  border: 1px solid var(--svg-wizard-field-border, var(--svg-wizard-line));
  border-radius: var(--svg-wizard-field-radius, max(5px, calc(var(--svg-wizard-radius) - 3px)));
  background-color: var(--svg-wizard-field-bg, #fff);
  color: var(--svg-wizard-field-text, var(--svg-wizard-text));
  font-family: var(--svg-wizard-field-font-family, inherit);
}

.svg-template-fullscreen-fields textarea {
  min-height: 122px;
  padding-top: 14px;
  padding-bottom: 14px;
}

.svg-template-fullscreen-fields input:focus,
.svg-template-fullscreen-fields textarea:focus,
.svg-template-fullscreen-fields select:focus {
  border-color: var(--svg-wizard-field-focus, var(--svg-wizard-brand));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--svg-wizard-field-focus, var(--svg-wizard-brand)) 18%, transparent);
  outline: none;
}

.svg-template-fullscreen-panel-actions {
  display: grid;
  gap: 10px;
  padding: var(--svg-wizard-panel-footer-padding-top, 18px) var(--svg-wizard-panel-padding-x) var(--svg-wizard-panel-footer-padding-bottom, var(--svg-wizard-panel-padding-x));
  border-top: 0;
  background: var(--svg-wizard-panel);
  box-shadow: none;
  z-index: 2;
}

.svg-template-fullscreen-next {
  width: 100%;
}

.svg-template-fullscreen-output-panel[hidden] {
  display: none !important;
}

.svg-template-fullscreen-output-panel {
  margin-top: 18px;
}

@media (max-width: 1180px) {
  .svg-template-wizard-app { --svg-wizard-editor-width: 400px; }
  .svg-template-fullscreen-card-area { padding-inline: 86px; }
}

@media (max-width: 980px) {
  body.svg-template-wizard-is-fullscreen { overflow: hidden; }
  .svg-template-wizard-fullscreen { overflow: auto; }
  .svg-template-wizard-app {
    grid-template-rows: var(--svg-wizard-header-height) minmax(0, 1fr);
  }
  .svg-template-fullscreen-card-area { padding-inline: 64px; }
}

/* Desktop wizard keeps its two-column layout and scrolls below the configured minimum size.
   A separate mobile wizard layout can be added later without changing this desktop shell. */



/* v1.0.28 Wizard design admin controls */
.svg-wizard-design-editor {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 12px;
}
.svg-wizard-design-editor .button-small {
  justify-self: start;
}

/* v1.0.28 Wizard design modal + responsive fullscreen navigation fixes */
.svg-wizard-design-summary {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 12px;
  min-width: 0;
}
.svg-wizard-design-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.svg-wizard-design-mini-strip {
  --mini-bg: #f6f1ec;
  --mini-panel: #fff;
  --mini-accent: #8d6e50;
  --mini-button: #c5b29f;
  --mini-button-text: #fffaf5;
  --mini-line: #e6dfd8;
  --mini-radius: 8px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 8px;
  min-height: 58px;
  padding: 8px;
  border: 1px solid var(--mini-line);
  border-radius: var(--mini-radius);
  background: var(--mini-bg);
}
.svg-wizard-design-mini-strip .mini-stage {
  display: grid;
  place-items: center;
  border-radius: calc(var(--mini-radius) - 2px);
  background: rgba(255,255,255,.45);
}
.svg-wizard-design-mini-strip .mini-card {
  width: 34px;
  height: 44px;
  background: #fff;
  border: 1px solid var(--mini-line);
  box-shadow: 0 5px 12px rgba(0,0,0,.12);
}
.svg-wizard-design-mini-strip .mini-panel {
  display: grid;
  gap: 5px;
  padding: 7px;
  border-radius: calc(var(--mini-radius) - 2px);
  background: var(--mini-panel);
}
.svg-wizard-design-mini-strip .mini-panel span,
.svg-wizard-design-mini-strip .mini-panel b {
  display: block;
  height: 5px;
  border-radius: 999px;
  background: var(--mini-line);
}
.svg-wizard-design-mini-strip .mini-panel b {
  background: var(--mini-button);
}
.svg-wizard-design-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: grid;
  place-items: center;
  padding: 26px;
  background: rgba(0,0,0,.45);
}
.svg-wizard-design-modal {
  width: min(1120px, 96vw);
  max-height: min(900px, 94vh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  overflow: hidden;
}
.svg-wizard-design-modal-head,
.svg-wizard-design-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid #dcdcde;
}
.svg-wizard-design-modal-footer {
  justify-content: flex-end;
  border-top: 1px solid #dcdcde;
  border-bottom: 0;
}
.svg-wizard-design-modal-head h2 {
  margin: 0;
}
.svg-wizard-design-modal-close {
  min-width: 36px;
  height: 36px;
  display: grid !important;
  place-items: center;
  font-size: 26px;
  text-decoration: none !important;
}
.svg-wizard-design-modal-body {
  min-height: 0;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 14px;
  padding: 16px;
  background: #f6f7f7;
}
.svg-wizard-design-group {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dcdcde;
  border-radius: 12px;
  background: #fff;
}
.svg-wizard-design-group h3 {
  margin: 0;
}
.svg-wizard-design-group > .description {
  margin: -4px 0 0;
}
.svg-wizard-design-controls {
  display: grid;
  gap: 10px;
}
.svg-wizard-design-controls .svg-inspector-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.svg-wizard-design-control,
.svg-wizard-design-controls .svg-inspector-field {
  min-width: 0;
}
.svg-wizard-design-controls input,
.svg-wizard-design-controls select,
.svg-wizard-design-controls textarea {
  max-width: 100%;
}
.svg-wizard-design-media-button {
  justify-self: start;
}
.svg-wizard-design-preview {
  --mini-bg: #f6f1ec;
  --mini-bg-image: none;
  --mini-panel: #fff;
  --mini-text: #15110e;
  --mini-muted: #6f6861;
  --mini-accent: #8d6e50;
  --mini-line: #e6dfd8;
  --mini-button: #c5b29f;
  --mini-button-text: #fffaf5;
  --mini-radius: 8px;
  --mini-shadow: 0 14px 30px rgba(36,27,20,.16);
  color: var(--mini-text);
  border: 1px solid var(--mini-line);
  border-radius: var(--mini-radius);
  overflow: hidden;
}
.svg-wizard-design-preview-topbar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px 14px;
  background: #fff;
}
.svg-wizard-design-preview-topbar strong {
  font-family: Georgia, serif;
  font-size: 20px;
  text-align: center;
}
.svg-wizard-design-preview-topbar .prev-back {
  color: var(--mini-text);
}
.svg-wizard-design-preview button,
.svg-wizard-design-preview-topbar button,
.svg-wizard-design-preview-panel button,
.svg-wizard-design-preview-controls button {
  min-height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: var(--mini-radius);
  background: var(--mini-button);
  color: var(--mini-button-text);
}
.svg-wizard-design-preview-stage {
  min-height: 190px;
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 18px;
  background-color: var(--mini-bg);
  background-image: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.6)), var(--mini-bg-image);
  background-size: auto, cover;
  background-position: center;
}
.svg-wizard-design-preview-stage .mini-card-large {
  justify-self: center;
  width: 92px;
  height: 130px;
  background: #fff;
  border: 1px solid var(--mini-line);
  box-shadow: var(--mini-shadow);
}
.svg-wizard-design-preview-stage .mini-arrow {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  color: var(--mini-text);
  font-size: 24px;
}
.svg-wizard-design-preview-stage .mini-tabs,
.svg-wizard-design-preview-controls .mini-tabs {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  gap: 6px;
}
.svg-wizard-design-preview-stage .mini-tabs b,
.svg-wizard-design-preview-controls .mini-tabs b {
  width: 54px;
  height: 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  border: 1px solid var(--mini-line);
}
.svg-wizard-design-preview-stage .mini-tabs b.active,
.svg-wizard-design-preview-controls .mini-tabs b.active {
  background: color-mix(in srgb, var(--mini-accent) 16%, #fff);
  border-color: var(--mini-accent);
}
.svg-wizard-design-preview-panel {
  display: grid;
  gap: 10px;
  padding: 18px;
  background: var(--mini-panel);
}
.svg-wizard-design-preview-panel small {
  color: var(--mini-muted);
}
.svg-wizard-design-preview-panel .mini-input {
  display: block;
  height: 36px;
  border: 1px solid var(--mini-line);
  border-radius: max(4px, calc(var(--mini-radius) - 3px));
  background: #fff;
}
.svg-wizard-design-preview-panel .mini-input.short {
  width: 70%;
}
.svg-wizard-design-preview-controls {
  display: grid;
  gap: 14px;
  padding: 18px;
  background: #fff;
}
.svg-wizard-design-preview-controls button {
  justify-self: start;
}

.svg-template-fullscreen-arrow[hidden] {
  display: none !important;
}
.svg-template-fullscreen-card-area {
  padding-inline: clamp(80px, 8vw, 132px);
}
.svg-template-fullscreen-arrow-left {
  left: clamp(18px, 3vw, 40px);
}
.svg-template-fullscreen-arrow-right {
  right: clamp(18px, 3vw, 32px);
}
.svg-template-fullscreen-view-tab-list {
  width: min(930px, calc(100vw - var(--svg-wizard-editor-width) - 100px));
  max-width: 930px;
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  scrollbar-width: thin;
}
.svg-template-fullscreen-view-tab {
  flex: 1 1 148px;
  min-width: 112px;
  max-width: 190px;
}
@media (max-width: 1180px) {
  .svg-template-fullscreen-view-tab-list {
    width: min(820px, calc(100vw - var(--svg-wizard-editor-width) - 60px));
  }
  .svg-template-fullscreen-view-tab {
    flex-basis: 132px;
    max-width: 170px;
  }
}
@media (max-width: 980px) {
  .svg-wizard-design-modal-body {
    grid-template-columns: 1fr;
  }
  .svg-template-fullscreen-view-tab-list {
    width: min(930px, calc(100vw - 28px));
  }
  .svg-template-fullscreen-view-tabs {
    justify-content: flex-start;
    overflow: hidden;
  }
  .svg-template-fullscreen-view-tab {
    flex: 0 0 128px;
    max-width: 150px;
  }
}
@media (max-width: 640px) {
  .svg-wizard-design-modal-overlay {
    padding: 10px;
  }
  .svg-wizard-design-modal {
    width: 100%;
    max-height: 96vh;
  }
  .svg-wizard-design-modal-body {
    padding: 10px;
  }
  .svg-wizard-design-controls .svg-inspector-grid {
    grid-template-columns: 1fr;
  }
  .svg-wizard-design-preview-topbar {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .svg-template-fullscreen-card-area {
    padding-inline: 72px;
  }
}


/* v1.0.30 centered fixed-size Wizard view icons + custom icon support */
.svg-template-fullscreen-view-tabs {
  justify-content: center;
  overflow: hidden;
}
.svg-template-fullscreen-view-tab-list {
  width: auto !important;
  max-width: min(930px, calc(100% - 40px));
  display: flex !important;
  grid-auto-flow: unset !important;
  grid-auto-columns: unset !important;
  gap: var(--svg-wizard-view-tab-gap, 0px);
  justify-content: flex-start;
  align-items: stretch;
  overflow-x: auto;
  overflow-y: hidden;
  background: transparent;
  border-radius: var(--svg-wizard-radius);
  box-shadow: 0 14px 45px rgba(48,35,24,.13);
  scrollbar-width: thin;
}
.svg-template-fullscreen-view-tab {
  flex: 0 0 var(--svg-wizard-view-tab-width, 150px) !important;
  width: var(--svg-wizard-view-tab-width, 150px) !important;
  max-width: var(--svg-wizard-view-tab-width, 150px) !important;
  min-width: var(--svg-wizard-view-tab-width, 150px) !important;
  min-height: var(--svg-wizard-view-tab-height, 96px) !important;
  height: var(--svg-wizard-view-tab-height, 96px);
  background: color-mix(in srgb, var(--svg-wizard-view-tab-bg, #ffffff) 88%, transparent) !important;
  color: var(--svg-wizard-view-tab-text, #23201d) !important;
  border-left: 1px solid var(--svg-wizard-view-tab-border, var(--svg-wizard-line)) !important;
  font-size: var(--svg-wizard-view-tab-font-size, 14px) !important;
  font-family: var(--svg-wizard-navigation-font-family, inherit) !important;
}
.svg-template-fullscreen-view-tab:first-child {
  border-left: 0 !important;
  border-radius: var(--svg-wizard-radius) 0 0 var(--svg-wizard-radius) !important;
}
.svg-template-fullscreen-view-tab:last-child {
  border-radius: 0 var(--svg-wizard-radius) var(--svg-wizard-radius) 0 !important;
}
.svg-template-fullscreen-view-tab + .svg-template-fullscreen-view-tab::before {
  display: none !important;
}
.svg-template-fullscreen-view-tab.is-active {
  color: var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand)) !important;
  background: color-mix(in srgb, var(--svg-wizard-view-tab-active-bg, #f4efe9) 92%, transparent) !important;
}
.svg-template-fullscreen-view-icon {
  width: var(--svg-wizard-view-tab-icon-size, 30px);
  height: var(--svg-wizard-view-tab-icon-size, 30px);
  font-size: var(--svg-wizard-view-tab-icon-size, 30px);
}
.svg-template-fullscreen-view-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.svg-template-fullscreen-view-label {
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}
.svg-wizard-icon-url-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
  align-items: center;
}
.svg-wizard-icon-url-line input {
  width: 100%;
  max-width: 100%;
}
.svg-wizard-design-preview-tabs {
  display: grid;
  place-items: center;
  overflow: hidden;
}
.svg-wizard-design-preview-tabs .mini-view-tabs {
  display: flex;
  gap: var(--mini-tab-gap, 0px);
  max-width: 100%;
  overflow-x: auto;
  border-radius: var(--mini-radius);
  box-shadow: 0 8px 24px rgba(48,35,24,.12);
}
.svg-wizard-design-preview-tabs .mini-view-tabs b {
  flex: 0 0 min(var(--mini-tab-width, 150px), 130px);
  width: min(var(--mini-tab-width, 150px), 130px);
  min-height: var(--mini-tab-height, 60px);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  background: var(--mini-tab-bg, #fff);
  color: var(--mini-tab-text, #23201d);
  border-left: 1px solid var(--mini-tab-border, #e6dfd8);
  font-style: normal;
}
.svg-wizard-design-preview-tabs .mini-view-tabs b:first-child { border-left: 0; }
.svg-wizard-design-preview-tabs .mini-view-tabs b.active {
  background: var(--mini-tab-active-bg, #f4efe9);
  color: var(--mini-tab-active-text, #8d6e50);
  box-shadow: inset 0 -2px 0 var(--mini-tab-active-text, #8d6e50);
}
.svg-wizard-design-preview-tabs .mini-view-tabs i {
  font-style: normal;
  font-size: var(--mini-tab-icon-size, 20px);
  line-height: 1;
}
.svg-wizard-design-preview-tabs .mini-view-tabs em {
  font-style: normal;
  font-size: var(--mini-tab-font-size, 12px);
  line-height: 1.2;
}
@media (max-width: 980px) {
  .svg-template-fullscreen-view-tab-list {
    max-width: calc(100vw - 28px);
  }
}
@media (max-width: 640px) {
  .svg-wizard-icon-url-line {
    grid-template-columns: 1fr;
  }
}


/* v1.0.31 configurable Wizard navigation arrows */
.svg-template-fullscreen-arrow {
  width: var(--svg-wizard-arrow-size, 68px) !important;
  height: var(--svg-wizard-arrow-size, 68px) !important;
  min-width: var(--svg-wizard-arrow-size, 68px) !important;
  border-radius: var(--svg-wizard-arrow-radius, 999px) !important;
  border: 1px solid var(--svg-wizard-arrow-border, transparent) !important;
  background: color-mix(in srgb, var(--svg-wizard-arrow-bg, #ffffff) var(--svg-wizard-arrow-bg-opacity, 94%), transparent) !important;
  color: var(--svg-wizard-arrow-color, var(--svg-wizard-text)) !important;
  box-shadow: var(--svg-wizard-arrow-shadow, 0 18px 50px rgba(42,31,23,.12)) !important;
  font-size: var(--svg-wizard-arrow-icon-size, 42px) !important;
}
.svg-template-fullscreen-arrow-left {
  left: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
}
.svg-template-fullscreen-arrow-right {
  right: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
}
.svg-template-fullscreen-arrow:hover {
  background: color-mix(in srgb, var(--svg-wizard-arrow-hover-bg, #ffffff) var(--svg-wizard-arrow-hover-bg-opacity, 100%), transparent) !important;
}
.svg-wizard-design-preview-arrows {
  min-height: 170px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 18px;
  background: linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.56)), var(--mini-bg);
}
.svg-wizard-design-preview-arrows .mini-card-large {
  justify-self: center;
  width: 92px;
  height: 126px;
  background: #fff;
  border: 1px solid var(--mini-line);
  box-shadow: var(--mini-shadow);
}
.svg-wizard-design-preview-arrows .mini-arrow-button {
  width: min(var(--mini-arrow-size, 68px), 56px);
  height: min(var(--mini-arrow-size, 68px), 56px);
  display: grid;
  place-items: center;
  border-radius: var(--mini-arrow-radius, 999px);
  border: 1px solid var(--mini-arrow-border, transparent);
  background: color-mix(in srgb, var(--mini-arrow-bg, #fff) var(--mini-arrow-bg-opacity, 94%), transparent);
  color: var(--mini-arrow-color, var(--mini-text));
  box-shadow: var(--mini-arrow-shadow, 0 8px 20px rgba(0,0,0,.12));
  font-size: var(--mini-arrow-icon-size, 28px);
  line-height: 1;
}

/* v1.0.33 arrow optical controls */
.svg-template-fullscreen-arrow {
  display: grid !important;
  place-items: center !important;
  line-height: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
.svg-template-fullscreen-arrow svg {
  display: block !important;
  width: var(--svg-wizard-arrow-icon-size, 28px) !important;
  height: var(--svg-wizard-arrow-icon-size, 28px) !important;
  flex: 0 0 auto !important;
  overflow: visible;
  transform: translate(0, 0);
}
.svg-wizard-design-preview-arrows .mini-arrow-button {
  display: grid !important;
  place-items: center !important;
  line-height: 0 !important;
}


/* v1.0.33 Mini preview arrow SVG parity */
.svg-wizard-design-preview-arrows .mini-arrow-button svg {
  display: block;
  width: var(--mini-arrow-icon-size, 18px);
  height: var(--mini-arrow-icon-size, 18px);
  overflow: visible;
  transform: translate(0, 0);
}
.svg-wizard-design-preview-arrows .mini-arrow-button svg path {
  stroke-width: var(--mini-arrow-stroke-width, 2.4);
}


/* v1.0.34 separate arrow offsets + background opacity */
.svg-template-fullscreen-arrow-left svg {
  transform: translate(var(--svg-wizard-arrow-left-icon-offset-x, 0px), var(--svg-wizard-arrow-left-icon-offset-y, 0px)) !important;
}
.svg-template-fullscreen-arrow-right svg {
  transform: translate(var(--svg-wizard-arrow-right-icon-offset-x, 0px), var(--svg-wizard-arrow-right-icon-offset-y, 0px)) !important;
}
.svg-wizard-design-preview-arrows .mini-arrow-left svg {
  transform: translate(var(--mini-arrow-left-offset-x, 0px), var(--mini-arrow-left-offset-y, 0px));
}
.svg-wizard-design-preview-arrows .mini-arrow-right svg {
  transform: translate(var(--mini-arrow-right-offset-x, 0px), var(--mini-arrow-right-offset-y, 0px));
}
.svg-wizard-design-preview-arrows .mini-arrow-button:hover {
  background: color-mix(in srgb, var(--mini-arrow-hover-bg, #fff) var(--mini-arrow-hover-bg-opacity, 100%), transparent);
}

/* v1.0.38 configurable wizard panel items */
.svg-wizard-panel-summary-head,
.svg-wizard-panel-add-buttons,
.svg-wizard-panel-item-tools {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.svg-wizard-panel-summary-head {
  justify-content: space-between;
}
.svg-wizard-panel-mini-list {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
.svg-wizard-panel-mini-list span {
  display: inline-flex;
  max-width: 100%;
  padding: 3px 6px;
  border: 1px solid #dcdcde;
  border-radius: 999px;
  background: #f6f7f7;
  color: #50575e;
  font-size: 11px;
  line-height: 1.25;
}
.svg-wizard-panel-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000004;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0, 0, 0, .46);
}

.svg-wizard-panel-modal-overlay .svg-wizard-panel-modal {
  position: relative;
  z-index: 1;
}

.svg-wizard-panel-modal {
  width: min(980px, 96vw);
  max-height: min(860px, 92vh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 22px 70px rgba(0,0,0,.28);
  overflow: hidden;
}
.svg-wizard-panel-modal-head,
.svg-wizard-panel-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid #dcdcde;
}
.svg-wizard-panel-modal-footer {
  justify-content: flex-end;
  border-top: 1px solid #dcdcde;
  border-bottom: 0;
}
.svg-wizard-panel-modal-head h2 {
  margin: 0;
}
.svg-wizard-panel-modal-body {
  min-height: 0;
  overflow: auto;
  padding: 18px;
}
.svg-wizard-panel-add-buttons {
  margin: 10px 0 16px;
}
.svg-wizard-panel-item-list {
  display: grid;
  gap: 10px;
}
.svg-wizard-panel-item {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fff;
}
.svg-wizard-panel-item-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.svg-wizard-panel-item-head strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-wizard-panel-item-controls {
  display: grid;
  gap: 8px;
}
.svg-wizard-panel-item-controls .svg-inspector-field {
  margin-bottom: 0;
}
.svg-template-panel-headline {
  margin: 0 0 10px;
  color: var(--svg-wizard-text);
  font-size: 26px;
  line-height: 1.12;
  font-weight: 600;
}
.svg-template-panel-helptext {
  margin: -4px 0 22px;
  color: var(--svg-wizard-muted);
  font-size: 13px;
  line-height: 1.5;
}
.svg-template-panel-divider {
  height: 1px;
  margin: 20px 0 22px;
  background: var(--svg-wizard-line);
}
.svg-template-panel-spacer {
  flex: 0 0 auto;
}

/* v1.0.42 panel editor accordion modules + insert slots */
.svg-wizard-panel-add-buttons {
  display: none;
}
.svg-wizard-panel-item-list {
  gap: 0;
}
.svg-wizard-panel-empty {
  margin: 6px 0 10px;
  text-align: center;
}
.svg-wizard-panel-insert-slot {
  position: relative;
  display: grid;
  justify-items: center;
  min-height: 24px;
  margin: 2px 0;
}
.svg-wizard-panel-insert-slot::before {
  content: '';
  position: absolute;
  left: 16px;
  right: 16px;
  top: 50%;
  height: 1px;
  background: #dcdcde;
  transform: translateY(-50%);
}
.svg-wizard-panel-insert-button {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0 !important;
  display: grid !important;
  place-items: center;
  border-radius: 50% !important;
  border: 1px solid #c3c4c7 !important;
  background: #fff !important;
  color: #2271b1 !important;
  font-size: 18px !important;
  line-height: 1 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.svg-wizard-panel-insert-button:hover,
.svg-wizard-panel-insert-slot.is-open .svg-wizard-panel-insert-button {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
}
.svg-wizard-panel-insert-menu {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
  max-width: 100%;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid #dcdcde;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.svg-wizard-panel-item {
  gap: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}
.svg-wizard-panel-item + .svg-wizard-panel-item {
  margin-top: 0;
}
.svg-wizard-panel-item.is-collapsed {
  background: #fbfbfc;
}
.svg-wizard-panel-item-head {
  grid-template-columns: 30px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 10px 12px;
}
.svg-wizard-panel-item-toggle {
  min-width: 26px;
  height: 26px;
  padding: 0 !important;
  display: grid !important;
  place-items: center;
  text-decoration: none !important;
  color: #50575e !important;
}
.svg-wizard-panel-item-title {
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #1d2327 !important;
  font-weight: 700;
  text-align: left;
  text-decoration: none !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-wizard-panel-item.is-collapsed .svg-wizard-panel-item-title {
  color: #3c434a !important;
}
.svg-wizard-panel-item-controls {
  padding: 0 12px 12px 50px;
  border-top: 1px solid #f0f0f1;
}
@media (max-width: 640px) {
  .svg-wizard-panel-insert-menu {
    border-radius: 10px;
  }
  .svg-wizard-panel-item-head {
    grid-template-columns: 28px minmax(0, 1fr);
  }
  .svg-wizard-panel-item-tools {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
  .svg-wizard-panel-item-controls {
    padding-left: 12px;
  }
}

/* v1.0.42 Wizard views modal accordion */
.svg-wizard-views-summary {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 12px;
  min-width: 0;
}
.svg-wizard-views-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000002;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.38);
}
.svg-wizard-views-modal {
  width: min(980px, 96vw);
  max-height: min(860px, 92vh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 22px 70px rgba(0,0,0,.28);
  overflow: hidden;
}
.svg-wizard-views-modal-head,
.svg-wizard-views-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid #dcdcde;
}
.svg-wizard-views-modal-footer {
  justify-content: flex-end;
  border-top: 1px solid #dcdcde;
  border-bottom: 0;
}
.svg-wizard-views-modal-head h2 {
  margin: 0;
}
.svg-wizard-views-modal-body {
  min-height: 0;
  overflow: auto;
  padding: 18px;
}
.svg-wizard-view-item-list {
  display: grid;
  gap: 0;
}
.svg-wizard-view-item .svg-wizard-view-item-controls {
  display: grid;
  gap: 10px;
}
.svg-wizard-view-panel-summary {
  margin-top: 4px;
}
.svg-wizard-view-insert-slot .svg-wizard-panel-insert-menu {
  border-radius: 999px;
}
.svg-wizard-view-item .svg-wizard-view-icon-url {
  margin-bottom: 0;
}
@media (max-width: 640px) {
  .svg-wizard-views-modal-overlay {
    padding: 10px;
  }
  .svg-wizard-views-modal {
    width: 100%;
    max-height: 96vh;
  }
  .svg-wizard-views-modal-body {
    padding: 12px;
  }
  .svg-wizard-view-insert-slot .svg-wizard-panel-insert-menu {
    border-radius: 10px;
  }
}


/* v1.0.43 frontend panel items without automatic separators */
.svg-template-fullscreen-fields .svg-template-field {
  padding-bottom: 0;
  border-bottom: 0;
}
.svg-template-fullscreen-fields .svg-template-field + .svg-template-field,
.svg-template-fullscreen-fields .svg-template-panel-headline + .svg-template-field,
.svg-template-fullscreen-fields .svg-template-panel-helptext + .svg-template-field,
.svg-template-fullscreen-fields .svg-template-panel-spacer + .svg-template-field {
  margin-top: 0;
}
.svg-template-fullscreen-fields .svg-template-panel-divider {
  display: block;
}

/* v1.0.44 backend object alignment controls */
.svg-align-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.svg-align-buttons .description {
  flex: 1 1 100%;
  margin: 0;
}

/* v1.0.45 backend Smart Guides + snapping */
.svg-designer-stage-tools {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}
.svg-smart-guides-toggle.is-active {
  border-color: #7c3aed !important;
  background: #f3e8ff !important;
  color: #4c1d95 !important;
}
.svg-designer-smart-guide {
  stroke: #7c3aed;
  stroke-width: .45;
  stroke-dasharray: 2.4 1.4;
  pointer-events: none;
}
@media (max-width: 782px) {
  .svg-designer-stage-tools {
    justify-content: flex-start;
  }
}

/* v1.0.47 textarea preset dropdown in frontend wizard */
.svg-template-preset-dropdown-wrap {
  display: grid;
  gap: 7px;
  margin: 8px 0 12px;
}
.svg-template-preset-dropdown-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--svg-wizard-muted, #50575e);
}
.svg-template-select-wrap {
  position: relative;
  display: block;
  width: 100%;
}
.svg-template-select-wrap::after {
  content: '';
  position: absolute;
  right: var(--svg-wizard-select-chevron-right, 14px);
  top: 50%;
  width: var(--svg-wizard-select-chevron-size, 18px);
  height: var(--svg-wizard-select-chevron-size, 18px);
  transform: translateY(-50%);
  pointer-events: none;
  display: var(--svg-wizard-select-chevron-display, block);
  background: var(--svg-wizard-select-chevron-color, var(--svg-wizard-brand));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.svg-template-preset-select {
  width: 100%;
  max-width: 100%;
  min-height: var(--svg-wizard-field-height, 52px);
  padding: 0 calc(var(--svg-wizard-select-chevron-right, 14px) + var(--svg-wizard-select-chevron-size, 18px) + 12px) 0 var(--svg-wizard-field-padding-x, 16px);
  border: 1px solid var(--svg-wizard-field-border, var(--svg-wizard-line, #dcdcde));
  border-radius: var(--svg-wizard-field-radius, max(5px, calc(var(--svg-wizard-radius, 8px) - 3px)));
  background-color: var(--svg-wizard-field-bg, #fff);
  color: var(--svg-wizard-field-text, var(--svg-wizard-text, #15110e));
  font: inherit;
  font-family: var(--svg-wizard-field-font-family, inherit);
  appearance: none;
  -webkit-appearance: none;
}
.svg-template-preset-select:focus {
  border-color: var(--svg-wizard-field-focus, var(--svg-wizard-brand, #2271b1));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--svg-wizard-field-focus, var(--svg-wizard-brand)) 18%, transparent);
  outline: none;
}


/* v1.0.47 configurable Wizard form fields and dropdown chevron */
.svg-wizard-design-preview-formfields {
  display: grid;
  gap: 12px;
  padding: 18px;
  background: var(--mini-panel, #fff);
}
.svg-wizard-design-preview-formfields label {
  display: grid;
  gap: 5px;
  color: var(--mini-muted, #6f6861);
  font-size: 12px;
  font-weight: 600;
}
.svg-wizard-design-preview-formfields .mini-field {
  position: relative;
  display: flex;
  align-items: center;
  min-height: var(--mini-field-height, 36px);
  padding: 0 var(--mini-field-padding-x, 12px);
  border: 1px solid var(--mini-field-border, #e6dfd8);
  border-radius: var(--mini-field-radius, 5px);
  background: var(--mini-field-bg, #fff);
  color: var(--mini-field-text, #15110e);
  font-style: normal;
  font-weight: 400;
}
.svg-wizard-design-preview-formfields .mini-field:first-of-type {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mini-field-focus, #8d6e50) 18%, transparent);
}
.svg-wizard-design-preview-formfields .mini-textarea {
  min-height: 58px;
  align-items: flex-start;
  padding-top: 9px;
}
.svg-wizard-design-preview-formfields .mini-textarea::before,
.svg-wizard-design-preview-formfields .mini-textarea::after {
  content: '';
  display: block;
  height: 5px;
  border-radius: 999px;
  background: var(--mini-line, #e6dfd8);
}
.svg-wizard-design-preview-formfields .mini-textarea::before { width: 88%; }
.svg-wizard-design-preview-formfields .mini-textarea::after { width: 62%; margin-top: 10px; }
.svg-wizard-design-preview-formfields .mini-select {
  padding-right: calc(var(--mini-select-chevron-right, 10px) + var(--mini-select-chevron-size, 14px) + 10px);
}
.svg-wizard-design-preview-formfields .mini-select i {
  position: absolute;
  right: var(--mini-select-chevron-right, 10px);
  top: 50%;
  width: var(--mini-select-chevron-size, 14px);
  height: var(--mini-select-chevron-size, 14px);
  transform: translateY(-50%);
  display: var(--mini-select-chevron-display, block);
  background: var(--mini-select-chevron-color, #8d6e50);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}


/* v1.0.49 select chevron fix + upload button design parity */
.svg-template-fullscreen-fields .svg-template-select-wrap select.svg-template-preset-select,
.svg-template-wizard-fullscreen .svg-template-select-wrap select.svg-template-preset-select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: none !important;
  background-color: var(--svg-wizard-field-bg, #fff) !important;
  color: var(--svg-wizard-field-text, var(--svg-wizard-text, #15110e)) !important;
  border-color: var(--svg-wizard-field-border, var(--svg-wizard-line, #dcdcde)) !important;
  border-radius: var(--svg-wizard-field-radius, max(5px, calc(var(--svg-wizard-radius, 8px) - 3px))) !important;
  min-height: var(--svg-wizard-field-height, 52px) !important;
  padding-left: var(--svg-wizard-field-padding-x, 16px) !important;
  padding-right: calc(var(--svg-wizard-select-chevron-right, 14px) + var(--svg-wizard-select-chevron-size, 18px) + 12px) !important;
}
.svg-template-select-wrap select.svg-template-preset-select::-ms-expand {
  display: none;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .svg-template-button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .svg-template-button:not(.button-link-delete) {
  min-height: calc(var(--svg-wizard-button-font-size, 16px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 4px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  border: 0 !important;
  border-radius: var(--svg-cart-button-radius, var(--svg-wizard-radius, 8px)) !important;
  background: var(--svg-wizard-button, #c5b29f) !important;
  color: var(--svg-wizard-button-text, #fffaf5) !important;
  box-shadow: 0 8px 22px rgba(125,101,80,.18) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .svg-template-button:hover,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .svg-template-button:not(.button-link-delete):hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(125,101,80,.22) !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .svg-template-button:disabled,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .svg-template-button:not(.button-link-delete):disabled {
  opacity: .6;
  transform: none;
  cursor: not-allowed;
}

/* v1.0.49 image editor design parity: buttons, sliders and tools card */
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-tools-card {
  border-color: var(--svg-wizard-field-border, var(--svg-wizard-line, #dcdcde)) !important;
  border-radius: var(--svg-cart-button-radius, var(--svg-wizard-radius, 8px)) !important;
  background: var(--svg-wizard-panel, #ffffff) !important;
  color: var(--svg-cart-text, var(--svg-wizard-text, #15110e)) !important;
  box-shadow: none !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-tools-card .svg-template-image-controls-title,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-range-row span,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-range-row em,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-editor-caption,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactinfo strong,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactinfo span {
  color: var(--svg-wizard-text, #15110e) !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-editor-caption,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactinfo span {
  color: var(--svg-wizard-muted, #6f6861) !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .button-link-delete {
  min-height: calc(var(--svg-wizard-button-font-size, 16px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 4px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  border: 0 !important;
  border-radius: var(--svg-cart-button-radius, var(--svg-wizard-radius, 8px)) !important;
  background: var(--svg-wizard-button, #c5b29f) !important;
  color: var(--svg-wizard-button-text, #fffaf5) !important;
  box-shadow: 0 8px 22px rgba(125,101,80,.18) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button:hover,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button:hover,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .button:hover,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-button:hover,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .button-link-delete:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(125,101,80,.22) !important;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button:disabled,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button:disabled,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .button:disabled,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-button:disabled,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .button-link-delete:disabled {
  opacity: .6;
  transform: none;
  cursor: not-allowed;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-range-input,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"] {
  accent-color: var(--svg-wizard-button, #c5b29f);
  width: 100%;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--svg-wizard-field-border, var(--svg-wizard-line, #dcdcde)) 75%, #ffffff);
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  margin-top: -6px;
  border-radius: 999px;
  border: 2px solid var(--svg-wizard-panel, #ffffff);
  background: var(--svg-upload-loading-progress, var(--svg-wizard-button, #c5b29f));
  box-shadow: 0 2px 7px rgba(0,0,0,.22);
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]::-moz-range-track {
  height: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--svg-wizard-field-border, var(--svg-wizard-line, #dcdcde)) 75%, #ffffff);
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]::-moz-range-progress {
  height: 6px;
  border-radius: 999px;
  background: var(--svg-upload-loading-progress, var(--svg-wizard-button, #c5b29f));
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid var(--svg-wizard-panel, #ffffff);
  background: var(--svg-upload-loading-progress, var(--svg-wizard-button, #c5b29f));
  box-shadow: 0 2px 7px rgba(0,0,0,.22);
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]:focus {
  outline: none;
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--svg-wizard-field-focus, var(--svg-wizard-brand, #8d6e50)) 20%, transparent), 0 2px 7px rgba(0,0,0,.22);
}
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field input[type="range"]:focus::-moz-range-thumb {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--svg-wizard-field-focus, var(--svg-wizard-brand, #8d6e50)) 20%, transparent), 0 2px 7px rgba(0,0,0,.22);
}

/* v1.0.50 Wizard design overlay cleanup */
.svg-wizard-design-modal-body {
  grid-template-columns: 1fr !important;
  align-content: start;
}
.svg-wizard-design-group {
  width: 100%;
}
.svg-wizard-design-group .svg-wizard-design-controls {
  max-width: 980px;
}
.svg-wizard-design-real-form-preview {
  display: grid !important;
  gap: 16px !important;
  padding: 18px !important;
  background: var(--mini-panel, #fff) !important;
}
.svg-wizard-design-real-form-preview label {
  display: grid;
  gap: 7px;
  color: var(--mini-text, #15110e);
  font-size: 12px;
  font-weight: 600;
}
.svg-wizard-design-real-form-preview input,
.svg-wizard-design-real-form-preview textarea,
.svg-wizard-design-real-form-preview select {
  width: 100%;
  min-height: var(--mini-field-height, 45px);
  padding: 0 var(--mini-field-padding-x, 16px);
  border: 1px solid var(--mini-field-border, #e6dfd8);
  border-radius: var(--mini-field-radius, 5px);
  background: var(--mini-field-bg, #fff);
  color: var(--mini-field-text, #15110e);
  font: inherit;
  box-shadow: none;
}
.svg-wizard-design-real-form-preview input {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mini-field-focus, #8d6e50) 18%, transparent);
}
.svg-wizard-design-real-form-preview textarea {
  min-height: 86px;
  padding-top: 12px;
  padding-bottom: 12px;
  resize: none;
}
.svg-wizard-design-real-form-preview .mini-select-real {
  position: relative;
  display: block;
}
.svg-wizard-design-real-form-preview select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: calc(var(--mini-select-chevron-right, 14px) + var(--mini-select-chevron-size, 16px) + 12px);
}
.svg-wizard-design-real-form-preview .mini-select-real i {
  position: absolute;
  right: var(--mini-select-chevron-right, 14px);
  top: 50%;
  width: var(--mini-select-chevron-size, 16px);
  height: var(--mini-select-chevron-size, 16px);
  transform: translateY(-50%);
  display: var(--mini-select-chevron-display, block);
  pointer-events: none;
  background: var(--mini-select-chevron-color, #8d6e50);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.svg-wizard-design-button-preview {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap;
  align-items: center;
  padding: 18px !important;
  background: var(--mini-panel, #fff) !important;
}
.svg-wizard-design-button-preview .mini-primary,
.svg-wizard-design-button-preview .mini-secondary {
  min-height: calc(var(--mini-button-font-size, 14px) + var(--mini-button-padding-y, 11px) + var(--mini-button-padding-y, 11px) + 4px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--mini-button-padding-y, 11px) var(--mini-button-padding-x, 18px);
  border-radius: var(--mini-radius, 8px);
  font-weight: 600;
}
.svg-wizard-design-button-preview .mini-primary {
  border: 0;
  background: var(--mini-button, #c5b29f);
  color: var(--mini-button-text, #fffaf5);
  box-shadow: 0 8px 20px rgba(125,101,80,.16);
}
.svg-wizard-design-button-preview .mini-secondary {
  border: 1px solid var(--mini-line, #e6dfd8);
  background: #fff;
  color: var(--mini-accent, #8d6e50);
}
.svg-wizard-design-button-preview .mini-radius-card {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 18px;
  border: 1px solid var(--mini-line, #e6dfd8);
  border-radius: var(--mini-radius, 8px);
  background: color-mix(in srgb, var(--mini-accent, #8d6e50) 9%, #fff);
  color: var(--mini-text, #15110e);
}
.svg-wizard-design-preview-tabs {
  padding: 18px;
  background: var(--mini-panel, #fff);
}
.svg-wizard-design-preview-tabs .mini-view-tabs {
  justify-self: start;
}
/* WordPress media modal must sit above the custom design overlay. */
.media-modal,
.media-frame,
.media-modal-content {
  z-index: 1000102 !important;
}
.media-modal-backdrop {
  z-index: 1000101 !important;
}


/* v1.0.51 real Wizard designer dropdown preview */
.svg-wizard-design-real-form-preview .mini-select-real {
  position: relative;
  display: block;
  width: 100%;
}
.svg-wizard-design-real-form-preview .mini-select-real select {
  width: 100%;
  max-width: 100%;
  min-height: var(--mini-field-height, 45px);
  padding: 0 calc(var(--mini-select-chevron-right, 14px) + var(--mini-select-chevron-size, 16px) + 12px) 0 var(--mini-field-padding-x, 16px);
  border: 1px solid var(--mini-field-border, #e6dfd8);
  border-radius: var(--mini-field-radius, 5px);
  background: var(--mini-field-bg, #fff) !important;
  color: var(--mini-field-text, #15110e);
  font: inherit;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.svg-wizard-design-real-form-preview .mini-select-real select::-ms-expand {
  display: none;
}
.svg-wizard-design-real-form-preview .mini-select-real::after {
  content: '';
  position: absolute;
  right: var(--mini-select-chevron-right, 14px);
  top: 50%;
  width: calc(var(--mini-select-chevron-size, 16px) * .42);
  height: calc(var(--mini-select-chevron-size, 16px) * .42);
  border: solid var(--mini-select-chevron-color, #8d6e50);
  border-width: 0 2px 2px 0;
  transform: translateY(-72%) rotate(45deg);
  pointer-events: none;
  display: var(--mini-select-chevron-display, block);
}
.svg-wizard-design-real-form-preview .mini-select-real i {
  display: none !important;
}


/* v1.0.54 Wizard font designer */
.svg-wizard-design-preview {
  font-family: var(--mini-font, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}
.svg-wizard-design-real-form-preview input,
.svg-wizard-design-real-form-preview textarea,
.svg-wizard-design-real-form-preview select {
  font-family: var(--mini-field-font, inherit) !important;
}
.svg-wizard-design-preview-tabs .mini-view-tabs b,
.svg-wizard-design-preview-tabs .mini-view-tabs em {
  font-family: var(--mini-navigation-font, inherit);
}
.svg-wizard-design-button-preview button {
  font-family: var(--mini-button-font, inherit);
}
.svg-wizard-design-button-preview .mini-radius-card {
  font-family: var(--mini-font, inherit);
}
.svg-template-fullscreen-fields .svg-template-panel-headline {
  font-family: var(--svg-wizard-heading-font-family, Georgia, "Times New Roman", serif);
}
.svg-template-fullscreen-fields .svg-template-panel-help,
.svg-template-fullscreen-fields .svg-template-field-label,
.svg-template-fullscreen-fields .svg-template-upload-hint,
.svg-template-fullscreen-fields .description {
  font-family: var(--svg-wizard-font-family, inherit);
}
.svg-template-fullscreen-fields button,
.svg-template-fullscreen-panel-actions button,
.svg-template-upload-compactactions .button,
.svg-template-image-actions .button {
  font-family: var(--svg-wizard-button-font-family, inherit) !important;
}

/* v1.0.54 Wizard font controls moved into their matching design sections */


/* v1.0.63 responsive tablet/mobile preparation */
.svg-template-wizard-app[data-responsive-mode="tablet"] {
  --svg-wizard-editor-width: var(--svg-wizard-tablet-editor-width, 360px);
  --svg-wizard-desktop-min-width: var(--svg-wizard-tablet-min-width, 900px);
  --svg-wizard-desktop-min-height: var(--svg-wizard-tablet-min-height, 600px);
  --svg-wizard-view-nav-bottom-gap: var(--svg-wizard-view-nav-bottom-gap, 24px);
  --svg-wizard-header-height: 76px;
  --svg-wizard-panel-padding-x: var(--svg-wizard-tablet-panel-padding, 24px);
  --svg-wizard-panel-padding-top: var(--svg-wizard-tablet-panel-padding, 24px);
  --svg-wizard-panel-padding-bottom: 16px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-title {
  font-size: clamp(22px, 2.8vw, 32px);
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-topbar {
  padding: 0 16px 0 22px;
  gap: 12px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next {
  min-height: 44px;
  padding: 0 18px !important;
  font-size: 14px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-card-area {
  padding: 24px 72px 12px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-svg-wrap,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-svg-wrap .svg-template-preview-svg {
  max-height: calc(100vh - var(--svg-wizard-header-height) - var(--svg-wizard-tabs-height) - 40px);
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-content {
  padding-bottom: 14px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions {
  padding-top: 10px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  --svg-wizard-desktop-min-width: 0px;
  --svg-wizard-desktop-min-height: 0px;
}



/* v1.0.57 responsive tablet layout fixes */
.svg-template-fullscreen-view-tab-list {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.svg-template-fullscreen-view-tab-list::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-view-tabs {
  min-height: 0;
  align-items: center;
  padding: 0 24px var(--svg-wizard-view-nav-bottom-gap, 24px);
  overflow: visible;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel {
  min-height: 0;
  max-height: calc(100dvh - var(--svg-wizard-header-height));
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions {
  flex-shrink: 0;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next {
  min-height: 42px;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-layout,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-preview-stage {
  min-height: 0;
}

/* v1.0.57 responsive debug overlay */
.svg-template-responsive-debug {
  position: fixed;
  top: calc(8px + env(safe-area-inset-top, 0px));
  left: calc(8px + env(safe-area-inset-left, 0px));
  z-index: 1000002;
  max-width: min(280px, calc(100vw - 16px));
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(15, 18, 22, .82);
  color: #fff;
  font: 11px/1.45 Menlo, Consolas, Monaco, monospace;
  box-shadow: 0 8px 26px rgba(0,0,0,.24);
  pointer-events: none;
  white-space: pre;
}
.svg-template-responsive-debug strong {
  display: block;
  margin-bottom: 3px;
  color: #b8e7ff;
}

/* v1.0.60 adaptive view navigation */
.svg-template-fullscreen-view-tabs {
  max-width: 100%;
  min-width: 0;
}
.svg-template-fullscreen-view-tab-list {
  max-width: 100% !important;
  overflow: hidden !important;
  justify-content: center;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-tab {
  flex-basis: var(--svg-wizard-view-scaled-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  width: var(--svg-wizard-view-scaled-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  min-width: var(--svg-wizard-view-scaled-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  max-width: var(--svg-wizard-view-scaled-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  min-height: var(--svg-wizard-view-scaled-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  height: var(--svg-wizard-view-scaled-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  font-size: var(--svg-wizard-view-scaled-font-size, var(--svg-wizard-view-tab-font-size, 14px)) !important;
  padding: var(--svg-wizard-view-scaled-pad-y, 10px) var(--svg-wizard-view-scaled-pad-x, 14px) !important;
  gap: var(--svg-wizard-view-scaled-gap, 9px);
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-icon {
  width: var(--svg-wizard-view-scaled-icon-size, var(--svg-wizard-view-tab-icon-size, 30px));
  height: var(--svg-wizard-view-scaled-icon-size, var(--svg-wizard-view-tab-icon-size, 30px));
  font-size: var(--svg-wizard-view-scaled-icon-size, var(--svg-wizard-view-tab-icon-size, 30px));
}
.svg-template-fullscreen-view-tabs.is-icon-only .svg-template-fullscreen-view-tab {
  flex-basis: var(--svg-wizard-view-icon-only-width, 64px) !important;
  width: var(--svg-wizard-view-icon-only-width, 64px) !important;
  min-width: var(--svg-wizard-view-icon-only-width, 64px) !important;
  max-width: var(--svg-wizard-view-icon-only-width, 64px) !important;
  padding: 7px 10px !important;
  gap: 0;
}
.svg-template-fullscreen-view-tabs.is-icon-only .svg-template-fullscreen-view-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}
.svg-template-view-menu-button {
  min-height: min(var(--svg-wizard-view-tab-height, 96px), calc(var(--svg-wizard-tabs-height, 128px) - 22px));
  min-width: min(360px, calc(100% - 32px));
  max-width: calc(100% - 32px);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 22px !important;
  border: 1px solid var(--svg-wizard-view-tab-border, var(--svg-wizard-line)) !important;
  border-radius: var(--svg-wizard-radius) !important;
  background: color-mix(in srgb, var(--svg-wizard-view-tab-bg, #ffffff) 92%, transparent) !important;
  color: var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand)) !important;
  box-shadow: 0 14px 45px rgba(48,35,24,.13) !important;
  font-family: var(--svg-wizard-navigation-font-family, inherit) !important;
  font-size: var(--svg-wizard-view-tab-font-size, 14px) !important;
}
.svg-template-view-menu-button .svg-template-fullscreen-view-icon {
  width: var(--svg-wizard-view-tab-icon-size, 30px);
  height: var(--svg-wizard-view-tab-icon-size, 30px);
  font-size: var(--svg-wizard-view-tab-icon-size, 30px);
}
.svg-template-view-menu-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-template-view-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000001;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.42);
}
.svg-template-view-menu-dialog {
  width: min(520px, 94vw);
  max-height: min(720px, 88vh);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  border-radius: calc(var(--svg-wizard-radius, 8px) + 6px);
  background: var(--svg-wizard-panel, #fff);
  color: var(--svg-wizard-text, #15110e);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
}
.svg-template-view-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--svg-wizard-line, #e6dfd8);
}
.svg-template-view-menu-head h3 {
  margin: 0;
  font-family: var(--svg-wizard-heading-font-family, inherit);
  font-size: 20px;
}
.svg-template-view-menu-close {
  min-width: 36px;
  min-height: 36px;
  border: 0 !important;
  background: transparent !important;
  color: var(--svg-wizard-text, #15110e) !important;
  font-size: 28px !important;
  box-shadow: none !important;
}
.svg-template-view-menu-grid {
  overflow: auto;
  display: grid;
  gap: 8px;
  padding: 16px;
}
.svg-template-view-menu-item {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 58px;
  padding: 10px 14px !important;
  border: 1px solid var(--svg-wizard-view-tab-border, var(--svg-wizard-line)) !important;
  border-radius: var(--svg-wizard-radius) !important;
  background: var(--svg-wizard-view-tab-bg, #fff) !important;
  color: var(--svg-wizard-view-tab-text, #23201d) !important;
  font-family: var(--svg-wizard-navigation-font-family, inherit) !important;
  text-align: left;
  box-shadow: none !important;
}
.svg-template-view-menu-item.is-active {
  background: var(--svg-wizard-view-tab-active-bg, #f4efe9) !important;
  color: var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand)) !important;
  border-color: var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand)) !important;
}
.svg-template-view-menu-item .svg-template-fullscreen-view-icon {
  flex: 0 0 var(--svg-wizard-view-tab-icon-size, 30px);
}

/* v1.0.60 adaptive view navigation hardening */
.svg-template-fullscreen-view-tabs {
  width: 100%;
  box-sizing: border-box;
  contain: layout;
}
.svg-template-fullscreen-view-tabs .svg-template-fullscreen-view-tab-list {
  width: min(var(--svg-wizard-view-effective-width, 100%), 100%) !important;
  max-width: 100% !important;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  overflow: hidden !important;
  transform: none !important;
  box-sizing: border-box;
}
.svg-template-fullscreen-view-tabs.is-hidden-mode {
  display: none !important;
}
.svg-template-fullscreen-view-tabs.is-hidden-mode .svg-template-fullscreen-view-tab-list {
  display: none !important;
}
.svg-template-fullscreen-view-tabs.is-menu-mode {
  display: flex;
  align-items: center;
  justify-content: center;
}
.svg-template-fullscreen-view-tabs.is-menu-mode .svg-template-view-menu-button {
  max-width: min(360px, calc(100% - 24px));
}


/* v1.0.61 view navigation stage-width correction */
.svg-template-fullscreen-view-tabs {
  justify-content: center !important;
}
.svg-template-fullscreen-view-tabs .svg-template-fullscreen-view-tab-list {
  flex: 0 1 auto !important;
  overflow: visible !important;
  scroll-behavior: auto !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-tab,
.svg-template-fullscreen-view-tabs.is-icon-only .svg-template-fullscreen-view-tab {
  box-sizing: border-box;
}

/* v1.0.63 proportional view navigation */
.svg-template-fullscreen-view-tabs {
  align-items: end;
  padding-bottom: var(--svg-wizard-view-nav-bottom-gap, 24px);
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-view-tabs {
  padding-bottom: var(--svg-wizard-view-nav-bottom-gap, 24px);
}
.svg-template-fullscreen-view-tabs .svg-template-fullscreen-view-tab-list {
  height: auto !important;
  max-height: none !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-tab-list {
  gap: var(--svg-wizard-view-scaled-list-gap, var(--svg-wizard-view-tab-gap, 0px));
}

/* v1.0.65 Wizard design collapsible groups + setting tooltips */
.svg-wizard-design-collapse-group {
  gap: 8px;
}
.svg-wizard-design-collapse-head {
  display: flex !important;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #1d2327 !important;
  text-align: left;
  text-decoration: none !important;
  font-weight: 700;
}
.svg-wizard-design-collapse-head:hover,
.svg-wizard-design-collapse-head:focus {
  color: #0a4b78 !important;
}
.svg-wizard-design-collapse-marker {
  display: inline-flex;
  width: 16px;
  justify-content: center;
  color: #50575e;
}
.svg-wizard-design-collapse-title {
  font-size: 15px;
  line-height: 1.3;
}
.svg-wizard-design-collapse-content {
  display: grid;
  gap: 10px;
}
.svg-wizard-design-collapse-group.is-collapsed .svg-wizard-design-collapse-content {
  display: none;
}
.svg-wizard-design-collapse-group.is-collapsed > .description {
  margin-bottom: 0;
}
.svg-wizard-design-modal .svg-inspector-field > span,
.svg-wizard-design-modal .svg-inspector-field-head > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.svg-help-tooltip {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  border-radius: 999px;
  background: #eaf3fb;
  color: #0a4b78;
  border: 1px solid #b8d7ee;
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  cursor: help;
}
.svg-help-tooltip::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 1000003;
  left: 50%;
  bottom: calc(100% + 8px);
  width: min(320px, 70vw);
  transform: translateX(-50%);
  padding: 8px 10px;
  border-radius: 8px;
  background: #1d2327;
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  white-space: normal;
  box-shadow: 0 8px 24px rgba(0,0,0,.24);
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
}
.svg-help-tooltip::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: calc(100% + 3px);
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #1d2327;
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
}
.svg-help-tooltip:hover::after,
.svg-help-tooltip:focus::after,
.svg-help-tooltip:hover::before,
.svg-help-tooltip:focus::before {
  opacity: 1;
}


/* v1.0.66 Tooltip positioning fixes */
.svg-help-tooltip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  place-items: unset !important;
  padding: 0 !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  box-sizing: border-box !important;
  line-height: 16px !important;
  font-size: 11px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  text-align: center !important;
  vertical-align: middle !important;
}
.svg-help-tooltip::before,
.svg-help-tooltip::after {
  display: none !important;
}
.svg-design-tooltip-bubble {
  position: fixed;
  z-index: 1000004;
  max-width: min(340px, calc(100vw - 24px));
  padding: 9px 11px;
  border-radius: 8px;
  background: #1d2327;
  color: #fff;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  white-space: normal;
  box-shadow: 0 8px 24px rgba(0,0,0,.24);
  pointer-events: none;
  display: none;
}


/* v1.0.69 mobile stacked tablet layout */
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  --svg-wizard-desktop-min-width: 0px;
  --svg-wizard-desktop-min-height: 0px;
  --svg-wizard-editor-width: 100%;
  --svg-wizard-header-height: var(--svg-wizard-mobile-header-height, 72px);
  width: 100%;
  min-width: 0;
  min-height: 100dvh;
  height: auto;
  display: grid;
  grid-template-rows: var(--svg-wizard-header-height) auto;
  overflow-x: hidden;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar {
  height: var(--svg-wizard-header-height);
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  padding: 0 12px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-brand {
  display: none !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-title {
  font-size: clamp(20px, 5vw, 28px);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-back {
  font-size: 13px;
  min-height: 34px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar-right {
  gap: 6px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-zip {
  min-height: 36px;
  padding: 0 10px !important;
  font-size: 12px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-layout {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  min-height: 0;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage {
  --svg-wizard-mobile-stage-active-height: max(
    var(--svg-wizard-mobile-stage-min-height, 360px),
    calc(var(--svg-wizard-mobile-preview-min-height, 300px) + var(--svg-wizard-tabs-height) + 32px),
    min(var(--svg-wizard-mobile-stage-height, 48dvh), var(--svg-wizard-mobile-stage-max-height, 560px))
  );
  min-height: var(--svg-wizard-mobile-stage-active-height);
  height: var(--svg-wizard-mobile-stage-active-height);
  max-height: none;
  grid-template-rows: minmax(0, 1fr) var(--svg-wizard-tabs-height);
  overflow: hidden;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area {
  padding: 18px clamp(58px, 14vw, 82px) 8px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-svg-wrap {
  width: min(100%, var(--svg-wizard-mobile-preview-max-width, var(--svg-wizard-preview-max-width)));
  max-height: calc(var(--svg-wizard-mobile-stage-active-height) - var(--svg-wizard-tabs-height) - 32px);
  min-height: var(--svg-wizard-mobile-preview-min-height, 300px);
}

.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-svg-wrap .svg-template-preview-svg {
  max-height: calc(var(--svg-wizard-mobile-stage-active-height) - var(--svg-wizard-tabs-height) - 32px);
  min-height: var(--svg-wizard-mobile-preview-min-height, 300px);
}

.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow {
  width: clamp(44px, 11vw, var(--svg-wizard-arrow-size, 68px)) !important;
  height: clamp(44px, 11vw, var(--svg-wizard-arrow-size, 68px)) !important;
  min-width: clamp(44px, 11vw, var(--svg-wizard-arrow-size, 68px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-left {
  left: clamp(10px, 3vw, 22px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-right {
  right: clamp(10px, 3vw, 22px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tabs {
  padding-left: 12px;
  padding-right: 12px;
  padding-bottom: var(--svg-wizard-view-nav-bottom-gap, 24px);
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel {
  min-height: auto;
  overflow: visible;
  border-left: 0;
  border-top: 1px solid var(--svg-wizard-line);
  display: grid;
  grid-template-rows: auto auto;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content {
  overflow: visible;
  padding: var(--svg-wizard-mobile-panel-padding, 20px) var(--svg-wizard-mobile-panel-padding, 20px) 18px;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-title {
  font-size: clamp(24px, 7vw, 32px);
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
  position: sticky;
  bottom: 0;
  padding: 10px var(--svg-wizard-mobile-panel-padding, 20px) calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--svg-wizard-panel);
  z-index: 5;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next {
  min-height: 46px;
}


/* v1.0.71 dynamic proportional View-Navigation row */
.svg-template-fullscreen-view-tabs {
  min-height: 0 !important;
  align-self: stretch;
  display: flex;
  align-items: flex-end !important;
  justify-content: center !important;
  padding-top: 0 !important;
}
.svg-template-fullscreen-view-tabs .svg-template-fullscreen-view-tab-list {
  align-self: flex-end;
}
.svg-template-fullscreen-view-tabs.is-scaled {
  padding-bottom: var(--svg-wizard-view-nav-bottom-gap, 24px) !important;
}
.svg-template-fullscreen-view-tabs.is-icon-only,
.svg-template-fullscreen-view-tabs.is-menu-mode {
  padding-bottom: var(--svg-wizard-view-nav-bottom-gap, 24px) !important;
}

/* v1.0.71 View-Navigation zone height and mobile max scale */
.svg-template-fullscreen-view-tabs {
  height: var(--svg-wizard-tabs-height, auto) !important;
  min-height: var(--svg-wizard-tabs-height, 0px) !important;
  padding-bottom: var(--svg-wizard-view-current-bottom-gap, var(--svg-wizard-view-nav-bottom-gap, 24px)) !important;
  align-items: flex-end !important;
}
.svg-template-fullscreen-view-tabs .svg-template-fullscreen-view-tab-list {
  min-height: var(--svg-wizard-view-current-tab-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  height: var(--svg-wizard-view-current-tab-height, auto) !important;
  align-items: stretch !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-tab-list,
.svg-template-fullscreen-view-tabs.is-icon-only .svg-template-fullscreen-view-tab-list {
  min-height: var(--svg-wizard-view-current-tab-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  height: var(--svg-wizard-view-current-tab-height, auto) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tabs {
  padding-bottom: var(--svg-wizard-view-current-bottom-gap, var(--svg-wizard-view-nav-bottom-gap, 24px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tab-list {
  min-height: var(--svg-wizard-view-current-tab-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  height: var(--svg-wizard-view-current-tab-height, auto) !important;
}


/* v1.0.75 stable card/view-navigation split */
.svg-template-fullscreen-preview-stage {
  grid-template-rows: minmax(0, 1fr) var(--svg-wizard-tabs-height, 0px) !important;
}
.svg-template-fullscreen-card-area {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  align-self: stretch !important;
}
.svg-template-fullscreen-svg-wrap {
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
}
.svg-template-fullscreen-svg-wrap .svg-template-preview-svg {
  max-height: 100% !important;
  max-width: 100% !important;
}
.svg-template-fullscreen-view-tabs {
  grid-row: 2 !important;
  align-self: end !important;
  min-height: var(--svg-wizard-tabs-height, 0px) !important;
  height: var(--svg-wizard-tabs-height, auto) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-svg-wrap,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-svg-wrap .svg-template-preview-svg,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-svg-wrap,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-svg-wrap .svg-template-preview-svg {
  max-height: 100% !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage {
  grid-template-rows: minmax(0, 1fr) var(--svg-wizard-tabs-height, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area {
  min-height: 0 !important;
  overflow: hidden !important;
}

/* v1.0.75 collapsible debug overlay + mobile width hardening */
.svg-template-responsive-debug {
  pointer-events: auto !important;
  padding: 0 !important;
  overflow: hidden;
  white-space: normal !important;
}
.svg-template-responsive-debug-toggle {
  display: block;
  width: 100%;
  margin: 0;
  padding: 7px 9px;
  border: 0;
  background: rgba(255,255,255,.08);
  color: #b8e7ff;
  font: 11px/1.35 Menlo, Consolas, Monaco, monospace;
  text-align: left;
  cursor: pointer;
}
.svg-template-responsive-debug-body {
  margin: 0;
  padding: 8px 10px;
  color: #fff;
  font: 11px/1.45 Menlo, Consolas, Monaco, monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.svg-template-responsive-debug.is-collapsed .svg-template-responsive-debug-body {
  display: none;
}
.svg-template-responsive-debug.is-collapsed {
  max-width: min(260px, calc(100vw - 16px));
}

.svg-template-wizard-app[data-responsive-mode="mobile"],
.svg-template-wizard-app[data-responsive-mode="mobile"] *,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel * {
  box-sizing: border-box;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-layout,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-field,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-dropdown-wrap,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-field,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-preset-dropdown-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel {
  overflow-x: hidden;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-content {
  min-width: 0;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-panel-headline,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-panel-helptext,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-field-label,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-panel-headline,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-panel-helptext,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-field-label {
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields select,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields select {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-select-wrap {
  display: block;
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-select,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-preset-select {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.svg-template-view-menu-overlay {
  padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
}
.svg-template-view-menu-dialog {
  width: min(520px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px);
}
.svg-template-view-menu-grid,
.svg-template-view-menu-item,
.svg-template-view-menu-label {
  min-width: 0;
  max-width: 100%;
}
.svg-template-view-menu-item {
  overflow-wrap: anywhere;
}

/* v1.0.75 hard mobile viewport overflow containment */
body.svg-template-wizard-is-fullscreen {
  overflow-x: hidden !important;
}
.svg-template-wizard-fullscreen {
  max-width: 100vw !important;
  max-width: 100dvw !important;
  overflow-x: hidden !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  width: 100vw !important;
  width: 100dvw !important;
  max-width: 100vw !important;
  max-width: 100dvw !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  contain: layout paint;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-layout,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: var(--svg-wizard-mobile-header-height, 72px);
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  padding: max(8px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) 8px max(10px, env(safe-area-inset-left, 0px));
  overflow-x: hidden !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-back {
  grid-column: 1;
  grid-row: 1;
  max-width: 88px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-title {
  grid-column: 2;
  grid-row: 1;
  min-width: 0 !important;
  max-width: 100% !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar-right {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  overflow: hidden;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar-right > * {
  flex: 1 1 0;
  min-width: 0 !important;
  max-width: 100%;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-zip {
  max-width: 100%;
  min-width: 0 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage {
  max-width: 100vw !important;
  max-width: 100dvw !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area {
  padding-left: clamp(44px, 11vw, 64px) !important;
  padding-right: clamp(44px, 11vw, 64px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-left {
  left: max(8px, env(safe-area-inset-left, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-right {
  right: max(8px, env(safe-area-inset-right, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tabs,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tab-list {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
  padding-left: max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-left, 0px)) !important;
  padding-right: max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-right, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-field,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-panel-item,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-image-upload-field,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-upload-dropzone,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-upload-compactbar,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-image-editor,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-image-editor-frame,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-image-tools-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] input,
.svg-template-wizard-app[data-responsive-mode="mobile"] textarea,
.svg-template-wizard-app[data-responsive-mode="mobile"] select,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-dropdown-wrap {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-responsive-debug.is-collapsed,
.svg-template-responsive-debug.is-collapsed {
  max-width: calc(100vw - 20px) !important;
  max-width: calc(100dvw - 20px) !important;
}
@supports (width: 100dvw) {
  .svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area {
    max-width: 100dvw !important;
  }
}

/* v1.0.75 mobile modal and sticky action fixes */
body.svg-template-view-menu-is-open {
  overflow: hidden !important;
  touch-action: none;
}
.svg-template-view-menu-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000006 !important;
  width: 100vw !important;
  width: 100dvw !important;
  height: 100vh !important;
  height: 100dvh !important;
  display: grid !important;
  place-items: center !important;
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)) !important;
  background: rgba(0,0,0,.42) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.svg-template-view-menu-dialog {
  width: min(520px, calc(100dvw - 32px)) !important;
  max-width: calc(100dvw - 32px) !important;
  max-height: calc(100dvh - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  margin: auto !important;
  overflow: hidden !important;
}
.svg-template-view-menu-grid {
  max-height: 100% !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel {
  padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content {
  padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  width: 100dvw !important;
  max-width: 100vw !important;
  max-width: 100dvw !important;
  padding: 10px max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-left, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-right, 0px)) !important;
  background: color-mix(in srgb, var(--svg-wizard-panel, #ffffff) 96%, transparent) !important;
  box-shadow: 0 -10px 28px rgba(42,31,23,.10) !important;
  z-index: 1000002 !important;
  box-sizing: border-box !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next {
  width: 100% !important;
  max-width: 100% !important;
}
@supports not (width: 100dvw) {
  .svg-template-view-menu-dialog {
    width: min(520px, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
  }
}

/* v1.0.77 mobile fixed action footer visibility fix */
body.svg-template-wizard-is-mobile {
  overflow-x: hidden !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  /* Do not create a containing block for position: fixed children on iOS Safari. */
  contain: none !important;
  min-height: 100dvh !important;
  height: auto !important;
  overflow: visible !important;
  overflow-x: hidden !important;
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-layout {
  overflow: visible !important;
  overflow-x: hidden !important;
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel {
  overflow: visible !important;
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-content {
  overflow: visible !important;
  padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  width: 100vw !important;
  width: 100dvw !important;
  max-width: 100vw !important;
  max-width: 100dvw !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 10px max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-left, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(14px, var(--svg-wizard-mobile-panel-padding, 20px), env(safe-area-inset-right, 0px)) !important;
  background: color-mix(in srgb, var(--svg-wizard-panel, #ffffff) 98%, transparent) !important;
  box-shadow: 0 -10px 28px rgba(42,31,23,.12) !important;
  z-index: 1000010 !important;
  pointer-events: auto !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions .svg-template-fullscreen-next {
  display: inline-flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 48px !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-responsive-debug {
  z-index: 1000011 !important;
}
@supports not (width: 100dvw) {
  .svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}


/* v1.0.80 regression fix: safe background image opacity and hidden action footer */
.svg-template-fullscreen-preview-stage {
  background-image: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.65) 65%, rgba(255,255,255,.2)) !important;
  isolation: isolate;
}
.svg-template-fullscreen-preview-stage::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--svg-wizard-bg-image, none);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: var(--svg-wizard-bg-image-opacity, 1);
}
.svg-template-fullscreen-preview-stage::before {
  z-index: 1;
}
.svg-template-fullscreen-card-area,
.svg-template-fullscreen-view-tabs,
.svg-template-fullscreen-arrow {
  z-index: 2;
}
.svg-template-fullscreen-view-tabs {
  z-index: 3;
}
.svg-template-fullscreen-panel-actions[hidden],
.svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-fullscreen-panel-actions[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.svg-template-fullscreen-next[hidden] {
  display: none !important;
}
.svg-wizard-design-preview-stage {
  background-image: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.6)) !important;
  position: relative;
  isolation: isolate;
}
.svg-wizard-design-preview-stage::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--mini-bg-image, none);
  background-size: cover;
  background-position: center;
  opacity: var(--mini-bg-image-opacity, 1);
}
.svg-wizard-design-preview-stage > * {
  position: relative;
  z-index: 1;
}

/* v1.0.80 separate canvas arrow visibility from panel next button */
.svg-template-fullscreen-arrow[hidden],
.svg-template-fullscreen-arrow.is-hidden,
.svg-template-fullscreen-arrow[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.svg-template-fullscreen-arrow:disabled {
  pointer-events: none !important;
}


/* v1.0.81 canvas arrows: functional, above card, centered to card area */
.svg-template-fullscreen-card-area {
  position: relative !important;
}
.svg-template-fullscreen-card-area .svg-template-fullscreen-arrow {
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 30 !important;
  pointer-events: auto !important;
}
.svg-template-fullscreen-card-area .svg-template-fullscreen-arrow:hover {
  transform: translateY(calc(-50% - 1px)) scale(1.03) !important;
}
.svg-template-fullscreen-card-area .svg-template-fullscreen-arrow-left {
  left: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
}
.svg-template-fullscreen-card-area .svg-template-fullscreen-arrow-right {
  right: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
}
.svg-template-fullscreen-card-area .svg-template-fullscreen-svg-wrap,
.svg-template-fullscreen-card-area .svg-template-preview-svg {
  position: relative;
  z-index: 1;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area .svg-template-fullscreen-arrow-left {
  left: clamp(8px, 3vw, 18px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-card-area .svg-template-fullscreen-arrow-right {
  right: clamp(8px, 3vw, 18px) !important;
}

/* v1.0.83 text counters and preserved empty SVG lines */
.svg-template-text-usage {
  display: grid;
  gap: 3px;
  margin-top: 6px;
  color: var(--svg-wizard-muted, #646970);
  font-size: 12px;
  line-height: 1.35;
}
.svg-template-text-usage-line[hidden],
.svg-template-text-usage[hidden] {
  display: none !important;
}
.svg-template-text-usage.is-line-limit-reached .svg-template-text-usage-lines {
  color: #8a2424;
  font-weight: 600;
}

/* v1.0.84 mobile input zoom and dropdown clipping fix */
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields select {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  font-size: 16px !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-dropdown-wrap {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-select,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields select {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding-right: max(calc(var(--svg-wizard-select-chevron-right, 14px) + var(--svg-wizard-select-chevron-size, 18px) + 12px), var(--svg-wizard-field-padding-x, 16px)) !important;
}


/* v1.0.85 mobile form control width reserve for iOS clipping */
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields select,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-dropdown-wrap {
  width: calc(100% - 4px) !important;
  max-width: calc(100% - 4px) !important;
  margin-right: 4px !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap .svg-template-preset-select,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-select-wrap select {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
}
/* v1.0.87 hide customer image editor/tools before upload */
.svg-template-image-editor[hidden],
.svg-template-image-controls[hidden],
.svg-template-image-tools-card[hidden] {
  display: none !important;
}


/* v1.0.89 global customer image upload loading overlay */
.svg-template-global-upload-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000002;
  display: grid;
  place-items: center;
  padding: 24px;
  background: color-mix(in srgb, var(--svg-upload-loading-overlay-bg, #15110e) calc(var(--svg-upload-loading-overlay-opacity, .46) * 100%), transparent);
  backdrop-filter: blur(2px);
  cursor: wait;
  touch-action: none;
}
.svg-template-global-upload-box {
  width: min(360px, calc(100vw - 40px));
  display: grid;
  justify-items: center;
  gap: 11px;
  padding: 22px 20px;
  border: var(--svg-upload-loading-border-width, 1px) solid var(--svg-upload-loading-border, rgba(255,255,255,.42));
  border-radius: var(--svg-upload-loading-radius, 16px);
  background: var(--svg-upload-loading-box-bg, #fff);
  color: var(--svg-upload-loading-text, #15110e);
  box-shadow: 0 22px 70px rgba(0,0,0,.28);
  text-align: center;
}
.svg-template-global-upload-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--svg-upload-loading-progress-track, #e6dfd8);
  border-top-color: var(--svg-upload-loading-progress, var(--svg-wizard-brand, #8d6e50));
  border-radius: 50%;
  animation: svg-template-spin .8s linear infinite;
}
.svg-template-global-upload-title {
  font-size: 15px;
  line-height: 1.3;
}
.svg-template-global-upload-detail {
  min-height: 18px;
  color: color-mix(in srgb, var(--svg-upload-loading-text, #15110e) 70%, transparent);
  font-size: 13px;
  line-height: 1.35;
}
.svg-template-global-upload-progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--svg-upload-loading-progress-track, #eee8e1);
}
.svg-template-global-upload-progress-fill {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: var(--svg-upload-loading-progress, var(--svg-wizard-button, #c5b29f));
  transition: width .18s ease;
}

/* v1.0.90 mobile global upload progress width fix */
.svg-template-global-upload-overlay,
.svg-template-global-upload-overlay *,
.svg-template-global-upload-overlay *::before,
.svg-template-global-upload-overlay *::after {
  box-sizing: border-box;
}
.svg-template-global-upload-box {
  max-width: 100%;
  min-width: 0;
}
.svg-template-global-upload-progress {
  max-width: 100%;
  min-width: 0;
}
@media (max-width: 480px) {
  .svg-template-global-upload-overlay {
    padding: 14px;
  }
  .svg-template-global-upload-box {
    width: min(360px, calc(100vw - 28px));
    padding: 18px 14px;
  }
}

/* v1.0.91 Wizard configuration: Design/System tabs */
.svg-wizard-design-modal-body-tabs {
  display: block !important;
  grid-template-columns: none !important;
}
.svg-wizard-design-mode-tabs {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  gap: 6px;
  padding: 0 0 12px;
  margin: 0 0 14px;
  border-bottom: 1px solid #dcdcde;
  background: #f6f7f7;
}
.svg-wizard-design-mode-tab.is-active {
  border-color: #2271b1 !important;
  background: #eaf3fb !important;
  color: #0a4b78 !important;
  box-shadow: inset 0 -2px 0 #2271b1;
}
.svg-wizard-design-mode-panel {
  display: none;
}
.svg-wizard-design-mode-panel.is-active {
  display: grid;
  gap: 14px;
}
.svg-wizard-design-mode-description {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #dcdcde;
  border-left: 4px solid #2271b1;
  border-radius: 8px;
  background: #fff;
}


/* v1.0.93 reliable mobile action footer hiding */
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next[aria-hidden="true"] {
  display: none !important;
}

/* v1.0.94 Wizard configuration header tabs */
.svg-wizard-design-modal-head-config {
  align-items: stretch;
  padding: 0;
  background: #fff;
}
.svg-wizard-design-modal-titlewrap {
  min-width: 0;
  flex: 1 1 auto;
  display: grid;
  gap: 10px;
  padding: 16px 18px 12px;
}
.svg-wizard-design-modal-head-config .svg-wizard-design-modal-close {
  align-self: start;
  margin: 12px 14px 0 0;
}
.svg-wizard-design-mode-tabs-head,
.svg-wizard-design-modal-head .svg-wizard-design-mode-tabs {
  position: static;
  top: auto;
  z-index: auto;
  display: flex;
  gap: 6px;
  padding: 0;
  margin: 0;
  border-bottom: 0;
  background: transparent;
}
.svg-wizard-design-mode-tabs-head .svg-wizard-design-mode-tab {
  min-height: 32px;
  padding: 0 14px !important;
}
.svg-wizard-design-modal-body-tabs > .svg-wizard-design-mode-tabs {
  display: none !important;
}
@media (max-width: 640px) {
  .svg-wizard-design-modal-head-config {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0;
  }
  .svg-wizard-design-modal-titlewrap {
    padding: 12px 12px 10px;
    gap: 8px;
  }
  .svg-wizard-design-modal-head-config .svg-wizard-design-modal-close {
    margin: 8px 8px 0 0;
  }
  .svg-wizard-design-mode-tabs-head {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }
  .svg-wizard-design-mode-tabs-head .svg-wizard-design-mode-tab {
    flex: 0 0 auto;
  }
}

/* v1.0.96 configurable Wizard UI font sizes */
.svg-template-fullscreen-title {
  font-size: var(--svg-wizard-title-font-size, clamp(28px, 3vw, 40px)) !important;
}
.svg-template-fullscreen-back,
.svg-template-fullscreen-brand {
  font-size: var(--svg-wizard-topbar-font-size, 15px) !important;
}
.svg-template-fullscreen-buy,
.svg-template-fullscreen-zip,
.svg-template-fullscreen-next,
.svg-template-fullscreen-panel-actions button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .button-link-delete {
  font-size: var(--svg-wizard-button-font-size, 16px) !important;
}
.svg-template-fullscreen-buy,
.svg-template-fullscreen-zip,
.svg-template-fullscreen-next,
.svg-template-fullscreen-panel-actions button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone .button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-button,
.svg-template-fullscreen-editor-panel .svg-template-image-upload-field .button-link-delete {
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  min-height: calc(var(--svg-wizard-button-font-size, 16px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 4px) !important;
}
.svg-template-fullscreen-editor-title,
.svg-template-fullscreen-fields .svg-template-panel-headline {
  font-size: var(--svg-wizard-panel-headline-font-size, 26px) !important;
}
.svg-template-fullscreen-editor-copy,
.svg-template-fullscreen-fields .svg-template-panel-helptext {
  font-size: var(--svg-wizard-panel-help-font-size, 13px) !important;
}
.svg-template-fullscreen-fields .svg-template-field-label {
  font-size: var(--svg-wizard-field-label-font-size, 12px) !important;
}
.svg-template-fullscreen-fields input,
.svg-template-fullscreen-fields textarea,
.svg-template-fullscreen-fields select,
.svg-template-preset-select {
  font-size: var(--svg-wizard-field-font-size, 15px) !important;
}
.svg-template-text-usage {
  font-size: var(--svg-wizard-text-usage-font-size, 12px) !important;
}
.svg-template-fullscreen-view-tab {
  font-size: var(--svg-wizard-view-tab-font-size, 14px) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-title {
  font-size: var(--svg-wizard-tablet-title-font-size, var(--svg-wizard-title-font-size, 34px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-back,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-brand {
  font-size: var(--svg-wizard-tablet-topbar-font-size, var(--svg-wizard-topbar-font-size, 14px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-zip,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-image-actions .button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-upload-compactactions .button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-upload-dropzone .button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .button-link-delete {
  font-size: var(--svg-wizard-tablet-button-font-size, var(--svg-wizard-button-font-size, 15px)) !important;
  padding: var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) var(--svg-wizard-tablet-button-padding-x, var(--svg-wizard-button-padding-x, 20px)) !important;
  min-height: calc(var(--svg-wizard-tablet-button-font-size, var(--svg-wizard-button-font-size, 15px)) + var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) + var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) + 4px) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-title,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields .svg-template-panel-headline {
  font-size: var(--svg-wizard-tablet-panel-headline-font-size, var(--svg-wizard-panel-headline-font-size, 24px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-copy,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields .svg-template-panel-helptext {
  font-size: var(--svg-wizard-tablet-panel-help-font-size, var(--svg-wizard-panel-help-font-size, 13px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields .svg-template-field-label {
  font-size: var(--svg-wizard-tablet-field-label-font-size, var(--svg-wizard-field-label-font-size, 12px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-fields select,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-preset-select {
  font-size: var(--svg-wizard-tablet-field-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-text-usage {
  font-size: var(--svg-wizard-tablet-text-usage-font-size, var(--svg-wizard-text-usage-font-size, 12px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-view-tab {
  font-size: var(--svg-wizard-tablet-view-tab-font-size, var(--svg-wizard-view-tab-font-size, 13px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-title {
  font-size: var(--svg-wizard-mobile-title-font-size, var(--svg-wizard-tablet-title-font-size, 24px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-back,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-brand {
  font-size: var(--svg-wizard-mobile-topbar-font-size, var(--svg-wizard-tablet-topbar-font-size, 13px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-zip,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-image-actions .button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-upload-compactactions .button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-upload-dropzone .button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .button-link-delete {
  font-size: var(--svg-wizard-mobile-button-font-size, var(--svg-wizard-tablet-button-font-size, 15px)) !important;
  padding: var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) var(--svg-wizard-mobile-button-padding-x, var(--svg-wizard-tablet-button-padding-x, 18px)) !important;
  min-height: calc(var(--svg-wizard-mobile-button-font-size, var(--svg-wizard-tablet-button-font-size, 15px)) + var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) + var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) + 4px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-title,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields .svg-template-panel-headline {
  font-size: var(--svg-wizard-mobile-panel-headline-font-size, var(--svg-wizard-tablet-panel-headline-font-size, 22px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-copy,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields .svg-template-panel-helptext {
  font-size: var(--svg-wizard-mobile-panel-help-font-size, var(--svg-wizard-tablet-panel-help-font-size, 13px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields .svg-template-field-label {
  font-size: var(--svg-wizard-mobile-field-label-font-size, var(--svg-wizard-tablet-field-label-font-size, 12px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields input,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-fields select,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-preset-select {
  font-size: max(16px, var(--svg-wizard-mobile-field-font-size, 16px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-text-usage {
  font-size: var(--svg-wizard-mobile-text-usage-font-size, var(--svg-wizard-tablet-text-usage-font-size, 12px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-view-tab {
  font-size: var(--svg-wizard-mobile-view-tab-font-size, var(--svg-wizard-tablet-view-tab-font-size, 12px)) !important;
}
.svg-wizard-design-preview-formfields label {
  font-size: var(--mini-field-label-font-size, 12px) !important;
}
.svg-wizard-design-real-form-preview input,
.svg-wizard-design-real-form-preview textarea,
.svg-wizard-design-real-form-preview select {
  font-size: var(--mini-field-font-size, 14px) !important;
}
.svg-wizard-design-button-preview button,
.svg-wizard-design-button-preview .mini-radius-card {
  font-size: var(--mini-button-font-size, 14px) !important;
}
.svg-wizard-design-preview-tabs .mini-view-tabs em {
  font-size: var(--mini-tab-font-size, 12px) !important;
}


/* v1.0.96 global wizard configuration presets */
.svg-wizard-design-presets-panel {
  display: grid;
  gap: 14px;
}
.svg-wizard-design-preset-box {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dcdcde;
  border-radius: 12px;
  background: #fff;
}
.svg-wizard-design-preset-box h3 {
  margin: 0;
}
.svg-wizard-design-preset-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.svg-wizard-design-preset-status {
  min-height: 18px;
  margin: 0;
}
.svg-wizard-design-preset-status.is-error {
  color: #d63638;
}


/* v1.0.98 robust button padding variables
   Ensure the configurable padding values also work when set to 0 and win over older WordPress/button rules. */
.svg-template-wizard-app .svg-template-fullscreen-buy,
.svg-template-wizard-app .svg-template-fullscreen-zip,
.svg-template-wizard-app .svg-template-fullscreen-next,
.svg-template-wizard-app .svg-template-fullscreen-panel-actions button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .button-primary,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .button-secondary,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .button-link-delete {
  box-sizing: border-box !important;
  line-height: 1.2 !important;
  padding-block: var(--svg-wizard-button-padding-y, 14px) !important;
  padding-inline: var(--svg-wizard-button-padding-x, 24px) !important;
  padding: var(--svg-wizard-button-padding-y, 14px) var(--svg-wizard-button-padding-x, 24px) !important;
  min-height: calc(var(--svg-wizard-button-font-size, 16px) + var(--svg-wizard-button-padding-y, 14px) + var(--svg-wizard-button-padding-y, 14px) + 4px) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-zip,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel .button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel .button-primary,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel .button-secondary,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel .svg-template-button,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-editor-panel .button-link-delete {
  line-height: 1.2 !important;
  padding-block: var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) !important;
  padding-inline: var(--svg-wizard-tablet-button-padding-x, var(--svg-wizard-button-padding-x, 20px)) !important;
  padding: var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) var(--svg-wizard-tablet-button-padding-x, var(--svg-wizard-button-padding-x, 20px)) !important;
  min-height: calc(var(--svg-wizard-tablet-button-font-size, var(--svg-wizard-button-font-size, 15px)) + var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) + var(--svg-wizard-tablet-button-padding-y, var(--svg-wizard-button-padding-y, 12px)) + 4px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-zip,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel .button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel .button-primary,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel .button-secondary,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel .svg-template-button,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-editor-panel .button-link-delete {
  line-height: 1.2 !important;
  padding-block: var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) !important;
  padding-inline: var(--svg-wizard-mobile-button-padding-x, var(--svg-wizard-tablet-button-padding-x, 18px)) !important;
  padding: var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) var(--svg-wizard-mobile-button-padding-x, var(--svg-wizard-tablet-button-padding-x, 18px)) !important;
  min-height: calc(var(--svg-wizard-mobile-button-font-size, var(--svg-wizard-tablet-button-font-size, 15px)) + var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) + var(--svg-wizard-mobile-button-padding-y, var(--svg-wizard-tablet-button-padding-y, 11px)) + 4px) !important;
}
.svg-wizard-design-preview .svg-wizard-design-button-preview button,
.svg-wizard-design-preview .svg-wizard-design-button-preview .mini-radius-card {
  line-height: 1.2 !important;
  padding-block: var(--mini-button-padding-y, 11px) !important;
  padding-inline: var(--mini-button-padding-x, 18px) !important;
  padding: var(--mini-button-padding-y, 11px) var(--mini-button-padding-x, 18px) !important;
  min-height: calc(var(--mini-button-font-size, 14px) + var(--mini-button-padding-y, 11px) + var(--mini-button-padding-y, 11px) + 4px) !important;
}


/* v1.0.99 regression fixes: hidden footer wins after padding rules, and title/font-size preview variables are applied. */
.svg-template-wizard-app .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-panel-actions[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.svg-template-wizard-app .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-next[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app[data-responsive-mode="desktop"] .svg-template-fullscreen-next[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-next[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-next[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.svg-template-wizard-app .svg-template-fullscreen-title {
  font-size: var(--svg-wizard-title-font-size, clamp(28px, 3vw, 40px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="tablet"] .svg-template-fullscreen-title {
  font-size: var(--svg-wizard-tablet-title-font-size, var(--svg-wizard-title-font-size, 34px)) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-title {
  font-size: var(--svg-wizard-mobile-title-font-size, var(--svg-wizard-tablet-title-font-size, 24px)) !important;
}
.svg-wizard-design-preview-topbar strong {
  font-family: var(--mini-heading-font, Georgia, serif) !important;
  font-size: var(--mini-title-font-size, 20px) !important;
}

/* v1.0.101 mobile topbar auto-height fix
   Mobile header height is now a minimum. If configured button/font padding makes the
   topbar taller, the layout row grows and the card/content starts below it instead
   of clipping the topbar content. */
.svg-template-wizard-app[data-responsive-mode="mobile"] {
  grid-template-rows: auto auto !important;
  --svg-wizard-header-height: var(--svg-wizard-mobile-header-height, 72px);
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-topbar {
  height: auto !important;
  min-height: var(--svg-wizard-mobile-header-height, 72px) !important;
  overflow: visible !important;
  align-content: center;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-layout {
  min-height: 0 !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-preview-stage {
  min-height: max(var(--svg-wizard-mobile-stage-min-height, 360px), calc(var(--svg-wizard-mobile-preview-min-height, 300px) + var(--svg-wizard-tabs-height) + 32px), min(var(--svg-wizard-mobile-stage-height, 48dvh), var(--svg-wizard-mobile-stage-max-height, 560px)));
}


/* v1.0.102 component styles: targeted Wizard UI building blocks */
.svg-template-wizard-app {
  --svg-comp-header-title-color: var(--svg-wizard-text);
  --svg-comp-header-title-font-family: var(--svg-wizard-heading-font-family);
  --svg-comp-header-title-font-size: var(--svg-wizard-title-font-size, 40px);
  --svg-comp-header-title-font-weight: 600;
  --svg-comp-header-title-line-height: 1.1;
  --svg-comp-header-title-padding-x: 0px;
  --svg-comp-header-title-padding-y: 0px;
  --svg-comp-header-title-margin-bottom: 0px;

  --svg-comp-header-brand-color: var(--svg-wizard-brand);
  --svg-comp-back-text-color: var(--svg-wizard-text);

  --svg-comp-buy-button-background-color: var(--svg-wizard-button);
  --svg-comp-buy-button-color: var(--svg-wizard-button-text);
  --svg-comp-buy-button-border-color: var(--svg-wizard-button);
  --svg-comp-buy-button-border-width: 0px;
  --svg-comp-buy-button-radius: var(--svg-wizard-radius);
  --svg-comp-buy-button-min-height: 0px;

  --svg-comp-next-button-background-color: var(--svg-wizard-button);
  --svg-comp-next-button-color: var(--svg-wizard-button-text);
  --svg-comp-next-button-border-color: var(--svg-wizard-button);
  --svg-comp-next-button-border-width: 0px;
  --svg-comp-next-button-radius: var(--svg-wizard-radius);
  --svg-comp-next-button-min-height: 0px;
}
.svg-template-fullscreen-title {
  color: var(--svg-comp-header-title-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-header-title-font-family, var(--svg-wizard-heading-font-family)) !important;
  font-size: var(--svg-comp-header-title-font-size, var(--svg-wizard-title-font-size, 40px)) !important;
  font-weight: var(--svg-comp-header-title-font-weight, 600) !important;
  line-height: var(--svg-comp-header-title-line-height, 1.1) !important;
  padding: var(--svg-comp-header-title-padding-y, 0px) var(--svg-comp-header-title-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-header-title-margin-bottom, 0px) !important;
}
.svg-template-fullscreen-brand {
  color: var(--svg-comp-header-brand-color, var(--svg-wizard-brand)) !important;
  font-family: var(--svg-comp-header-brand-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-header-brand-font-size, var(--svg-wizard-topbar-font-size, 15px)) !important;
  font-weight: var(--svg-comp-header-brand-font-weight, 500) !important;
  line-height: var(--svg-comp-header-brand-line-height, 1.2) !important;
  padding: var(--svg-comp-header-brand-padding-y, 0px) var(--svg-comp-header-brand-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-header-brand-margin-bottom, 0px) !important;
}
.svg-template-fullscreen-back {
  color: var(--svg-comp-back-text-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-back-text-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-back-text-font-size, var(--svg-wizard-topbar-font-size, 15px)) !important;
  font-weight: var(--svg-comp-back-text-font-weight, 500) !important;
  line-height: var(--svg-comp-back-text-line-height, 1.2) !important;
  padding: var(--svg-comp-back-text-padding-y, 0px) var(--svg-comp-back-text-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-back-text-margin-bottom, 0px) !important;
}
.svg-template-fullscreen-buy,
.svg-template-fullscreen-zip {
  background: var(--svg-comp-buy-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-buy-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-buy-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-buy-button-font-size, var(--svg-wizard-button-font-size, 16px)) !important;
  font-weight: var(--svg-comp-buy-button-font-weight, 500) !important;
  padding: var(--svg-comp-buy-button-padding-y, var(--svg-wizard-button-padding-y, 14px)) var(--svg-comp-buy-button-padding-x, var(--svg-wizard-button-padding-x, 24px)) !important;
  border: var(--svg-comp-buy-button-border-width, 0px) solid var(--svg-comp-buy-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-buy-button-radius, var(--svg-wizard-radius)) !important;
  min-height: max(var(--svg-comp-buy-button-min-height, 0px), calc(var(--svg-comp-buy-button-font-size, 16px) + var(--svg-comp-buy-button-padding-y, 14px) + var(--svg-comp-buy-button-padding-y, 14px) + 4px)) !important;
}
.svg-template-panel-headline,
.svg-template-fullscreen-editor-title {
  color: var(--svg-comp-panel-headline-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-panel-headline-font-family, var(--svg-wizard-heading-font-family)) !important;
  font-size: var(--svg-comp-panel-headline-font-size, var(--svg-wizard-panel-headline-font-size, 26px)) !important;
  font-weight: var(--svg-comp-panel-headline-font-weight, 600) !important;
  line-height: var(--svg-comp-panel-headline-line-height, 1.12) !important;
  padding: var(--svg-comp-panel-headline-padding-y, 0px) var(--svg-comp-panel-headline-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-panel-headline-margin-bottom, 10px) !important;
}
.svg-template-panel-helptext,
.svg-template-fullscreen-editor-copy {
  color: var(--svg-comp-panel-help-color, var(--svg-wizard-muted)) !important;
  font-family: var(--svg-comp-panel-help-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-panel-help-font-size, var(--svg-wizard-panel-help-font-size, 13px)) !important;
  font-weight: var(--svg-comp-panel-help-font-weight, 400) !important;
  line-height: var(--svg-comp-panel-help-line-height, 1.5) !important;
  padding: var(--svg-comp-panel-help-padding-y, 0px) var(--svg-comp-panel-help-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-panel-help-margin-bottom, 22px) !important;
}
.svg-template-fullscreen-fields .svg-template-field-label {
  color: var(--svg-comp-field-label-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-field-label-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-field-label-font-size, var(--svg-wizard-field-label-font-size, 12px)) !important;
  font-weight: var(--svg-comp-field-label-font-weight, 600) !important;
  line-height: var(--svg-comp-field-label-line-height, 1.25) !important;
  padding: var(--svg-comp-field-label-padding-y, 0px) var(--svg-comp-field-label-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-field-label-margin-bottom, 6px) !important;
}
.svg-template-fullscreen-fields input:not([type="range"]):not([type="file"]),
.svg-template-fullscreen-fields textarea,
.svg-template-fullscreen-fields select {
  border-style: solid !important;
  font-weight: 400;
}
.svg-template-fullscreen-fields input:not([type="range"]):not([type="file"]) {
  min-height: var(--svg-comp-text-input-min-height, var(--svg-wizard-field-height, 52px)) !important;
  padding: var(--svg-comp-text-input-padding-y, 0px) var(--svg-comp-text-input-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-text-input-border-width, 1px) !important;
  border-color: var(--svg-comp-text-input-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-text-input-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-text-input-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-text-input-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-text-input-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-text-input-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-text-input-font-weight, 400) !important;
}
.svg-template-fullscreen-fields textarea {
  min-height: var(--svg-comp-textarea-min-height, 122px) !important;
  padding: var(--svg-comp-textarea-padding-y, 14px) var(--svg-comp-textarea-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-textarea-border-width, 1px) !important;
  border-color: var(--svg-comp-textarea-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-textarea-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-textarea-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-textarea-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-textarea-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-textarea-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-textarea-font-weight, 400) !important;
}
.svg-template-fullscreen-fields select {
  min-height: var(--svg-comp-select-min-height, var(--svg-wizard-field-height, 52px)) !important;
  padding: var(--svg-comp-select-padding-y, 0px) var(--svg-comp-select-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-select-border-width, 1px) !important;
  border-color: var(--svg-comp-select-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-select-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-select-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-select-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-select-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-select-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-select-font-weight, 400) !important;
}
.svg-template-fullscreen-next {
  background: var(--svg-comp-next-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-next-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-next-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-next-button-font-size, var(--svg-wizard-button-font-size, 16px)) !important;
  font-weight: var(--svg-comp-next-button-font-weight, 500) !important;
  padding: var(--svg-comp-next-button-padding-y, var(--svg-wizard-button-padding-y, 14px)) var(--svg-comp-next-button-padding-x, var(--svg-wizard-button-padding-x, 24px)) !important;
  border: var(--svg-comp-next-button-border-width, 0px) solid var(--svg-comp-next-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-next-button-radius, var(--svg-wizard-radius)) !important;
  min-height: max(var(--svg-comp-next-button-min-height, 0px), calc(var(--svg-comp-next-button-font-size, 16px) + var(--svg-comp-next-button-padding-y, 14px) + var(--svg-comp-next-button-padding-y, 14px) + 4px)) !important;
}
.svg-template-fullscreen-panel-actions[hidden],
.svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-fullscreen-next[hidden] {
  display: none !important;
}
.svg-wizard-component-style-list {
  display: grid;
  gap: 8px;
}
.svg-wizard-component-style-item {
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fbfbfc;
  overflow: hidden;
}
.svg-wizard-component-style-item > summary {
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 700;
}
.svg-wizard-component-style-inner {
  display: grid;
  gap: 10px;
  padding: 0 12px 12px;
}



/* v1.0.108 grouped component style editor */
.svg-wizard-component-style-list-grouped {
  gap: 12px;
}
.svg-wizard-component-style-category {
  border: 1px solid #c3c4c7;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.svg-wizard-component-style-category-summary {
  cursor: pointer;
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  background: #f6f7f7;
  border-bottom: 1px solid #dcdcde;
}
.svg-wizard-component-style-category-summary strong {
  color: #1d2327;
  font-size: 13px;
}
.svg-wizard-component-style-category-summary span {
  color: #646970;
  font-size: 12px;
  line-height: 1.35;
}
.svg-wizard-component-style-category-inner {
  display: grid;
  gap: 8px;
  padding: 12px;
}
.svg-wizard-component-style-category-inner .svg-wizard-component-style-item {
  background: #fbfbfc;
}
.svg-wizard-component-style-inner .svg-inspector-section-label {
  margin-top: 6px;
}
@media (max-width: 640px) {
  .svg-wizard-component-style-category-inner {
    padding: 10px;
  }
  .svg-wizard-component-style-category-summary {
    padding: 10px 12px;
  }
}

/* v1.0.106 system visibility regression guard
   Component styles must never override System settings for hiding the footer button or arrows. */
.svg-template-wizard-app .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-wizard-app .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-next[aria-hidden="true"],
.svg-template-wizard-app .svg-template-fullscreen-arrow[hidden],
.svg-template-wizard-app .svg-template-fullscreen-arrow.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-arrow[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* v1.0.108 mobile arrow icon centering
   Mobile reduces the circular arrow button size. Center the inner SVG independently
   from WordPress button metrics and keep the configured icon offsets working. */
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 0 !important;
  text-align: center !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow svg {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  display: block !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  width: var(--svg-wizard-arrow-icon-size, 28px) !important;
  height: var(--svg-wizard-arrow-icon-size, 28px) !important;
  max-width: calc(100% - 10px) !important;
  max-height: calc(100% - 10px) !important;
  transform-origin: center center !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-left svg {
  transform: translate(calc(-50% + var(--svg-wizard-arrow-left-icon-offset-x, 0px)), calc(-50% + var(--svg-wizard-arrow-left-icon-offset-y, 0px))) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-right svg {
  transform: translate(calc(-50% + var(--svg-wizard-arrow-right-icon-offset-x, 0px)), calc(-50% + var(--svg-wizard-arrow-right-icon-offset-y, 0px))) !important;
}

/* v1.0.109 Wizard-Konfiguration: AJAX-Speichern bei geöffnetem Modal */
.svg-wizard-design-modal-footer {
  justify-content: space-between;
}
.svg-wizard-design-modal-footer-left,
.svg-wizard-design-modal-footer-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.svg-wizard-design-save-status {
  min-height: 18px;
  color: #646970;
  font-size: 12px;
  line-height: 1.4;
}
.svg-wizard-design-save-status.is-success {
  color: #008a20;
}
.svg-wizard-design-save-status.is-error {
  color: #b32d2e;
  font-weight: 600;
}
.svg-wizard-design-save-screen {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(2px);
}
.svg-wizard-design-save-screen[hidden] {
  display: none !important;
}
.svg-wizard-design-save-box {
  min-width: min(360px, 92vw);
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 22px 24px;
  border: 1px solid #dcdcde;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 50px rgba(0,0,0,.18);
  text-align: center;
}
.svg-wizard-design-save-box .spinner {
  float: none;
  margin: 0;
}
.svg-wizard-design-save-box strong {
  font-size: 15px;
}
.svg-wizard-design-save-box small {
  color: #646970;
}
@media (max-width: 640px) {
  .svg-wizard-design-modal-footer,
  .svg-wizard-design-modal-footer-left,
  .svg-wizard-design-modal-footer-right {
    align-items: stretch;
    flex-direction: column;
  }
  .svg-wizard-design-modal-footer-left,
  .svg-wizard-design-modal-footer-right {
    width: 100%;
  }
  .svg-wizard-design-modal-footer-right .button,
  .svg-wizard-design-modal-footer-left .button {
    width: 100%;
    justify-content: center;
  }
}

/* v1.0.110 component styles priority fix
   The new Baustein-Stile must win over older global Desktop/Tablet/Mobile font-size,
   button and field rules. The values are already mode-specific because renderer.js
   writes the active mode's component values into these CSS variables. */
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-title,
.svg-template-wizard-app .svg-template-fullscreen-title {
  color: var(--svg-comp-header-title-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-header-title-font-family, var(--svg-wizard-heading-font-family)) !important;
  font-size: var(--svg-comp-header-title-font-size, var(--svg-wizard-title-font-size, 40px)) !important;
  font-weight: var(--svg-comp-header-title-font-weight, 600) !important;
  line-height: var(--svg-comp-header-title-line-height, 1.1) !important;
  padding: var(--svg-comp-header-title-padding-y, 0px) var(--svg-comp-header-title-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-header-title-margin-bottom, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-brand,
.svg-template-wizard-app .svg-template-fullscreen-brand {
  color: var(--svg-comp-header-brand-color, var(--svg-wizard-brand)) !important;
  font-family: var(--svg-comp-header-brand-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-header-brand-font-size, var(--svg-wizard-topbar-font-size, 15px)) !important;
  font-weight: var(--svg-comp-header-brand-font-weight, 500) !important;
  line-height: var(--svg-comp-header-brand-line-height, 1.2) !important;
  padding: var(--svg-comp-header-brand-padding-y, 0px) var(--svg-comp-header-brand-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-header-brand-margin-bottom, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-back,
.svg-template-wizard-app .svg-template-fullscreen-back {
  color: var(--svg-comp-back-text-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-back-text-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-back-text-font-size, var(--svg-wizard-topbar-font-size, 15px)) !important;
  font-weight: var(--svg-comp-back-text-font-weight, 500) !important;
  line-height: var(--svg-comp-back-text-line-height, 1.2) !important;
  padding: var(--svg-comp-back-text-padding-y, 0px) var(--svg-comp-back-text-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-back-text-margin-bottom, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-buy,
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-zip,
.svg-template-wizard-app .svg-template-fullscreen-buy,
.svg-template-wizard-app .svg-template-fullscreen-zip {
  background: var(--svg-comp-buy-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-buy-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-buy-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-buy-button-font-size, var(--svg-wizard-button-font-size, 16px)) !important;
  font-weight: var(--svg-comp-buy-button-font-weight, 500) !important;
  padding: var(--svg-comp-buy-button-padding-y, var(--svg-wizard-button-padding-y, 14px)) var(--svg-comp-buy-button-padding-x, var(--svg-wizard-button-padding-x, 24px)) !important;
  border: var(--svg-comp-buy-button-border-width, 0px) solid var(--svg-comp-buy-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-buy-button-radius, var(--svg-wizard-radius)) !important;
  min-height: max(var(--svg-comp-buy-button-min-height, 0px), calc(var(--svg-comp-buy-button-font-size, 16px) + var(--svg-comp-buy-button-padding-y, 14px) + var(--svg-comp-buy-button-padding-y, 14px) + 4px)) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-panel-headline,
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-editor-title,
.svg-template-wizard-app .svg-template-panel-headline,
.svg-template-wizard-app .svg-template-fullscreen-editor-title {
  color: var(--svg-comp-panel-headline-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-panel-headline-font-family, var(--svg-wizard-heading-font-family)) !important;
  font-size: var(--svg-comp-panel-headline-font-size, var(--svg-wizard-panel-headline-font-size, 26px)) !important;
  font-weight: var(--svg-comp-panel-headline-font-weight, 600) !important;
  line-height: var(--svg-comp-panel-headline-line-height, 1.12) !important;
  padding: var(--svg-comp-panel-headline-padding-y, 0px) var(--svg-comp-panel-headline-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-panel-headline-margin-bottom, 10px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-panel-helptext,
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-editor-copy,
.svg-template-wizard-app .svg-template-panel-helptext,
.svg-template-wizard-app .svg-template-fullscreen-editor-copy {
  color: var(--svg-comp-panel-help-color, var(--svg-wizard-muted)) !important;
  font-family: var(--svg-comp-panel-help-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-panel-help-font-size, var(--svg-wizard-panel-help-font-size, 13px)) !important;
  font-weight: var(--svg-comp-panel-help-font-weight, 400) !important;
  line-height: var(--svg-comp-panel-help-line-height, 1.5) !important;
  padding: var(--svg-comp-panel-help-padding-y, 0px) var(--svg-comp-panel-help-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-panel-help-margin-bottom, 22px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-fields .svg-template-field-label,
.svg-template-wizard-app .svg-template-fullscreen-fields .svg-template-field-label {
  color: var(--svg-comp-field-label-color, var(--svg-wizard-text)) !important;
  font-family: var(--svg-comp-field-label-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-field-label-font-size, var(--svg-wizard-field-label-font-size, 12px)) !important;
  font-weight: var(--svg-comp-field-label-font-weight, 600) !important;
  line-height: var(--svg-comp-field-label-line-height, 1.25) !important;
  padding: var(--svg-comp-field-label-padding-y, 0px) var(--svg-comp-field-label-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-field-label-margin-bottom, 6px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-fields input:not([type="range"]):not([type="file"]),
.svg-template-wizard-app .svg-template-fullscreen-fields input:not([type="range"]):not([type="file"]) {
  min-height: var(--svg-comp-text-input-min-height, var(--svg-wizard-field-height, 52px)) !important;
  padding: var(--svg-comp-text-input-padding-y, 0px) var(--svg-comp-text-input-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-text-input-border-width, 1px) !important;
  border-color: var(--svg-comp-text-input-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-text-input-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-text-input-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-text-input-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-text-input-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-text-input-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-text-input-font-weight, 400) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-fields textarea,
.svg-template-wizard-app .svg-template-fullscreen-fields textarea {
  min-height: var(--svg-comp-textarea-min-height, 122px) !important;
  padding: var(--svg-comp-textarea-padding-y, 14px) var(--svg-comp-textarea-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-textarea-border-width, 1px) !important;
  border-color: var(--svg-comp-textarea-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-textarea-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-textarea-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-textarea-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-textarea-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-textarea-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-textarea-font-weight, 400) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-fields select,
.svg-template-wizard-app[data-responsive-mode] .svg-template-preset-select,
.svg-template-wizard-app .svg-template-fullscreen-fields select,
.svg-template-wizard-app .svg-template-preset-select {
  min-height: var(--svg-comp-select-min-height, var(--svg-wizard-field-height, 52px)) !important;
  padding: var(--svg-comp-select-padding-y, 0px) var(--svg-comp-select-padding-x, var(--svg-wizard-field-padding-x, 16px)) !important;
  border-width: var(--svg-comp-select-border-width, 1px) !important;
  border-color: var(--svg-comp-select-border-color, var(--svg-wizard-field-border)) !important;
  border-radius: var(--svg-comp-select-radius, var(--svg-wizard-field-radius)) !important;
  background-color: var(--svg-comp-select-background-color, var(--svg-wizard-field-bg)) !important;
  color: var(--svg-comp-select-color, var(--svg-wizard-field-text)) !important;
  font-family: var(--svg-comp-select-font-family, var(--svg-wizard-field-font-family)) !important;
  font-size: var(--svg-comp-select-font-size, var(--svg-wizard-field-font-size, 15px)) !important;
  font-weight: var(--svg-comp-select-font-weight, 400) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-next,
.svg-template-wizard-app .svg-template-fullscreen-next {
  background: var(--svg-comp-next-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-next-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-next-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-next-button-font-size, var(--svg-wizard-button-font-size, 16px)) !important;
  font-weight: var(--svg-comp-next-button-font-weight, 500) !important;
  padding: var(--svg-comp-next-button-padding-y, var(--svg-wizard-button-padding-y, 14px)) var(--svg-comp-next-button-padding-x, var(--svg-wizard-button-padding-x, 24px)) !important;
  border: var(--svg-comp-next-button-border-width, 0px) solid var(--svg-comp-next-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-next-button-radius, var(--svg-wizard-radius)) !important;
  min-height: max(var(--svg-comp-next-button-min-height, 0px), calc(var(--svg-comp-next-button-font-size, 16px) + var(--svg-comp-next-button-padding-y, 14px) + var(--svg-comp-next-button-padding-y, 14px) + 4px)) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-panel-actions[hidden],
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-panel-actions.is-hidden,
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-panel-actions[aria-hidden="true"],
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-next[hidden],
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-next.is-hidden,
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-next[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* v1.0.112 component style font-family controls are saved per building block and mode.
   Frontend CSS already consumes the --svg-comp-*-font-family variables. */

/* v1.0.113 component style editor: general + collapsible responsive sub-sections */
.svg-wizard-component-style-inner {
  gap: 8px;
}
.svg-wizard-component-style-subsection {
  border: 1px solid #dcdcde;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.svg-wizard-component-style-subsection > summary {
  cursor: pointer;
  padding: 9px 10px;
  font-weight: 700;
  color: #1d2327;
  background: #fff;
}
.svg-wizard-component-style-general > summary {
  background: #f6fbff;
}
.svg-wizard-component-style-mode > summary {
  background: #fbfbfc;
}
.svg-wizard-component-style-subsection-inner {
  display: grid;
  gap: 10px;
  padding: 0 10px 10px;
}
@media (max-width: 640px) {
  .svg-wizard-component-style-subsection > summary {
    padding: 8px 9px;
  }
  .svg-wizard-component-style-subsection-inner {
    padding: 0 9px 9px;
  }
}


/* v1.0.118: Panel editor modal must sit above the Wizard views modal. */
.svg-wizard-panel-modal-overlay {
  z-index: 1000004 !important;
}
.svg-wizard-views-modal-overlay.has-panel-modal-open .svg-wizard-views-modal {
  pointer-events: none;
}


/* v1.0.118 layout/component style expansion */
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-preview-stage,
.svg-template-wizard-app .svg-template-fullscreen-preview-stage {
  background-color: var(--svg-comp-stage-background-color, var(--svg-wizard-bg)) !important;
  border: var(--svg-comp-stage-border-width, 0px) solid var(--svg-comp-stage-border-color, transparent) !important;
  border-radius: var(--svg-comp-stage-radius, 0px) !important;
  min-height: var(--svg-comp-stage-min-height, 0px);
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-card-area,
.svg-template-wizard-app .svg-template-fullscreen-card-area {
  padding: var(--svg-comp-stage-padding-y, 42px) var(--svg-comp-stage-padding-x, 112px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-preview-svg,
.svg-template-wizard-app .svg-template-preview-svg {
  background-color: var(--svg-comp-card-preview-background-color, #ffffff) !important;
  border: var(--svg-comp-card-preview-border-width, 0px) solid var(--svg-comp-card-preview-border-color, transparent) !important;
  border-radius: var(--svg-comp-card-preview-radius, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-svg-wrap,
.svg-template-wizard-app .svg-template-fullscreen-svg-wrap {
  padding: var(--svg-comp-card-preview-padding-y, 0px) var(--svg-comp-card-preview-padding-x, 0px) !important;
  min-height: var(--svg-comp-card-preview-min-height, 0px);
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-editor-panel,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel {
  background: var(--svg-comp-panel-container-background-color, var(--svg-wizard-panel)) !important;
  border-color: var(--svg-comp-panel-container-border-color, var(--svg-wizard-line)) !important;
  border-width: var(--svg-comp-panel-container-border-width, 1px) !important;
  border-radius: var(--svg-comp-panel-container-radius, 0px) !important;
  padding: var(--svg-comp-panel-container-padding-y, 0px) var(--svg-comp-panel-container-padding-x, 0px) !important;
  min-height: var(--svg-comp-panel-container-min-height, 0px);
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-editor-content,
.svg-template-wizard-app .svg-template-fullscreen-editor-content {
  background: var(--svg-comp-panel-content-background-color, var(--svg-wizard-panel)) !important;
  padding: var(--svg-comp-panel-content-padding-y, var(--svg-wizard-panel-padding-top, 46px)) var(--svg-comp-panel-content-padding-x, var(--svg-wizard-panel-padding-x, 38px)) var(--svg-wizard-panel-padding-bottom, 24px) !important;
  border: var(--svg-comp-panel-content-border-width, 0px) solid var(--svg-comp-panel-content-border-color, transparent) !important;
  border-radius: var(--svg-comp-panel-content-radius, 0px) !important;
  min-height: var(--svg-comp-panel-content-min-height, 0px);
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-panel-actions,
.svg-template-wizard-app .svg-template-fullscreen-panel-actions {
  background: var(--svg-comp-panel-footer-background-color, var(--svg-wizard-panel)) !important;
  padding: var(--svg-comp-panel-footer-padding-y, var(--svg-wizard-panel-footer-padding-top, 18px)) var(--svg-comp-panel-footer-padding-x, var(--svg-wizard-panel-padding-x, 38px)) var(--svg-wizard-panel-footer-padding-bottom, var(--svg-wizard-panel-padding-x, 38px)) !important;
  border: var(--svg-comp-panel-footer-border-width, 0px) solid var(--svg-comp-panel-footer-border-color, transparent) !important;
  border-radius: var(--svg-comp-panel-footer-radius, 0px) !important;
  min-height: var(--svg-comp-panel-footer-min-height, 0px);
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-text-usage,
.svg-template-wizard-app .svg-template-text-usage {
  color: var(--svg-comp-text-usage-color, var(--svg-wizard-muted)) !important;
  font-family: var(--svg-comp-text-usage-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-text-usage-font-size, var(--svg-wizard-text-usage-font-size, 12px)) !important;
  font-weight: var(--svg-comp-text-usage-font-weight, 400) !important;
  line-height: var(--svg-comp-text-usage-line-height, 1.35) !important;
  padding: var(--svg-comp-text-usage-padding-y, 0px) var(--svg-comp-text-usage-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-text-usage-margin-bottom, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-text-usage.is-line-limit-reached .svg-template-text-usage-lines,
.svg-template-wizard-app .svg-template-text-usage.is-line-limit-reached .svg-template-text-usage-lines {
  color: var(--svg-comp-text-usage-color, var(--svg-wizard-brand)) !important;
}


/* v1.0.119 View-Navigation in Baustein-Stile */
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab-list,
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list {
  background-color: color-mix(in srgb, var(--svg-comp-view-nav-container-background-color, transparent) 88%, transparent) !important;
  border: var(--svg-comp-view-nav-container-border-width, 0px) solid var(--svg-comp-view-nav-container-border-color, transparent) !important;
  border-radius: var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius)) !important;
  padding: var(--svg-comp-view-nav-container-padding-y, 0px) var(--svg-comp-view-nav-container-padding-x, 0px) !important;
  min-height: var(--svg-comp-view-nav-container-min-height, 0px);
  gap: var(--svg-comp-view-nav-tab-gap, var(--svg-wizard-view-tab-gap, 0px)) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab,
.svg-template-wizard-app .svg-template-fullscreen-view-tab {
  flex-basis: var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  width: var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  min-width: var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  max-width: var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px)) !important;
  min-height: var(--svg-comp-view-nav-tab-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  height: var(--svg-comp-view-nav-tab-height, var(--svg-wizard-view-tab-height, 96px)) !important;
  padding: var(--svg-comp-view-nav-tab-padding-y, 10px) var(--svg-comp-view-nav-tab-padding-x, 14px) !important;
  border-left: var(--svg-comp-view-nav-tab-border-width, 1px) solid var(--svg-comp-view-nav-tab-border-color, var(--svg-wizard-view-tab-border, var(--svg-wizard-line))) !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--svg-comp-view-nav-tab-background-color, var(--svg-wizard-view-tab-bg, #ffffff)) 88%, transparent) !important;
  color: var(--svg-comp-view-nav-text-color, var(--svg-comp-view-nav-tab-color, var(--svg-wizard-view-tab-text, #23201d))) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab.is-active,
.svg-template-wizard-app .svg-template-fullscreen-view-tab.is-active {
  background: color-mix(in srgb, var(--svg-comp-view-nav-tab-active-background-color, var(--svg-wizard-view-tab-active-bg, #f4efe9)) 92%, transparent) !important;
  color: var(--svg-comp-view-nav-text-active-color, var(--svg-comp-view-nav-tab-active-color, var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand)))) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-icon,
.svg-template-wizard-app .svg-template-fullscreen-view-icon {
  width: var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px)) !important;
  height: var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px)) !important;
  font-size: var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px)) !important;
  padding: var(--svg-comp-view-nav-icon-padding-y, 0px) var(--svg-comp-view-nav-icon-padding-x, 0px) !important;
  color: var(--svg-comp-view-nav-icon-color, currentColor) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab.is-active .svg-template-fullscreen-view-icon,
.svg-template-wizard-app .svg-template-fullscreen-view-tab.is-active .svg-template-fullscreen-view-icon {
  color: var(--svg-comp-view-nav-icon-active-color, currentColor) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-label,
.svg-template-wizard-app .svg-template-fullscreen-view-label {
  color: var(--svg-comp-view-nav-text-color, currentColor) !important;
  font-family: var(--svg-comp-view-nav-text-font-family, var(--svg-wizard-navigation-font-family)) !important;
  font-size: var(--svg-comp-view-nav-text-font-size, var(--svg-wizard-view-tab-font-size, 14px)) !important;
  font-weight: var(--svg-comp-view-nav-text-font-weight, 500) !important;
  line-height: var(--svg-comp-view-nav-text-line-height, 1.25) !important;
  padding: var(--svg-comp-view-nav-text-padding-y, 0px) var(--svg-comp-view-nav-text-padding-x, 0px) !important;
  margin-bottom: var(--svg-comp-view-nav-text-margin-bottom, 0px) !important;
}
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab.is-active .svg-template-fullscreen-view-label,
.svg-template-wizard-app .svg-template-fullscreen-view-tab.is-active .svg-template-fullscreen-view-label {
  color: var(--svg-comp-view-nav-text-active-color, currentColor) !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-tab {
  flex-basis: var(--svg-wizard-view-scaled-width, var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px))) !important;
  width: var(--svg-wizard-view-scaled-width, var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px))) !important;
  min-width: var(--svg-wizard-view-scaled-width, var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px))) !important;
  max-width: var(--svg-wizard-view-scaled-width, var(--svg-comp-view-nav-tab-width, var(--svg-wizard-view-tab-width, 150px))) !important;
  min-height: var(--svg-wizard-view-scaled-height, var(--svg-comp-view-nav-tab-height, var(--svg-wizard-view-tab-height, 96px))) !important;
  height: var(--svg-wizard-view-scaled-height, var(--svg-comp-view-nav-tab-height, var(--svg-wizard-view-tab-height, 96px))) !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-icon {
  width: var(--svg-wizard-view-scaled-icon-size, var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px))) !important;
  height: var(--svg-wizard-view-scaled-icon-size, var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px))) !important;
  font-size: var(--svg-wizard-view-scaled-icon-size, var(--svg-comp-view-nav-icon-icon-size, var(--svg-wizard-view-tab-icon-size, 30px))) !important;
}
.svg-template-fullscreen-view-tabs.is-scaled .svg-template-fullscreen-view-label {
  font-size: var(--svg-wizard-view-scaled-font-size, var(--svg-comp-view-nav-text-font-size, var(--svg-wizard-view-tab-font-size, 14px))) !important;
}


/* v1.0.121 View-Navigation: segment radius logic */
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list.is-segmented-tabs .svg-template-fullscreen-view-tab {
  border-radius: 0 !important;
}
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list.is-segmented-tabs .svg-template-fullscreen-view-tab:first-child {
  border-left: 0 !important;
  border-top-left-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius))) !important;
  border-bottom-left-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius))) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list.is-segmented-tabs .svg-template-fullscreen-view-tab:last-child {
  border-top-right-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius))) !important;
  border-bottom-right-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius))) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list.is-segmented-tabs .svg-template-fullscreen-view-tab:only-child {
  border-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-comp-view-nav-container-radius, var(--svg-wizard-radius))) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-view-tab-list.has-separated-tabs .svg-template-fullscreen-view-tab {
  border-radius: var(--svg-comp-view-nav-tab-radius, var(--svg-wizard-radius)) !important;
  border-left: var(--svg-comp-view-nav-tab-border-width, 1px) solid var(--svg-comp-view-nav-tab-border-color, var(--svg-wizard-view-tab-border, var(--svg-wizard-line))) !important;
  border-right: var(--svg-comp-view-nav-tab-border-width, 1px) solid var(--svg-comp-view-nav-tab-border-color, var(--svg-wizard-view-tab-border, var(--svg-wizard-line))) !important;
}


/* v1.0.122 View-Navigation active marker controls */
.svg-template-wizard-app[data-responsive-mode] .svg-template-fullscreen-view-tab.is-active::after,
.svg-template-wizard-app .svg-template-fullscreen-view-tab.is-active::after {
  display: var(--svg-wizard-view-tab-active-marker-display, block) !important;
  height: var(--svg-wizard-view-tab-active-marker-width, 2px) !important;
  background: var(--svg-wizard-view-tab-active-marker-color, var(--svg-wizard-view-tab-active-text, var(--svg-wizard-brand))) !important;
}

/* v1.0.127 image editor width controls visible and customer upload radius defaults */
.svg-wizard-component-style-folder {
  margin: 10px 0;
  border: 1px solid #dcdcde;
  border-radius: 10px;
  background: #fbfbfc;
  overflow: hidden;
}
.svg-wizard-component-style-folder-summary {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  cursor: pointer;
}
.svg-wizard-component-style-folder-summary strong {
  font-size: 13px;
}
.svg-wizard-component-style-folder-summary span {
  color: #646970;
  font-size: 12px;
  line-height: 1.35;
}
.svg-wizard-component-style-folder-inner {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-top: 1px solid #dcdcde;
  background: #fff;
}

/* v1.0.125 customer image upload component styles */
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone {
  padding: var(--svg-comp-upload-dropzone-padding-y, 16px) var(--svg-comp-upload-dropzone-padding-x, 16px) !important;
  border-color: var(--svg-comp-upload-dropzone-border-color, #b9c3cf) !important;
  border-width: var(--svg-comp-upload-dropzone-border-width, 2px) !important;
  border-radius: var(--svg-comp-upload-dropzone-radius, 20px) !important;
  background: var(--svg-comp-upload-dropzone-background-color, #f8fafc) !important;
  color: var(--svg-comp-upload-dropzone-color, var(--svg-wizard-text)) !important;
  min-height: var(--svg-comp-upload-dropzone-min-height, auto);
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone strong,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone span,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-hint,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-status,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-editor-caption {
  color: var(--svg-comp-upload-hint-color, var(--svg-wizard-muted)) !important;
  font-family: var(--svg-comp-upload-hint-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-upload-hint-font-size, 12px) !important;
  font-weight: var(--svg-comp-upload-hint-font-weight, 400) !important;
  line-height: var(--svg-comp-upload-hint-line-height, 1.35) !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone strong {
  color: var(--svg-comp-upload-dropzone-color, var(--svg-wizard-text)) !important;
  font-weight: 700 !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone .button,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-compactactions .button,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-compactactions .button-link-delete,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-actions .button {
  min-height: calc(var(--svg-comp-upload-button-font-size, 16px) + var(--svg-comp-upload-button-padding-y, 14px) + var(--svg-comp-upload-button-padding-y, 14px) + 2px) !important;
  padding: var(--svg-comp-upload-button-padding-y, 14px) var(--svg-comp-upload-button-padding-x, 24px) !important;
  border: var(--svg-comp-upload-button-border-width, 0px) solid var(--svg-comp-upload-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-upload-button-radius, var(--svg-wizard-radius)) !important;
  background: var(--svg-comp-upload-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-upload-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-upload-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-upload-button-font-size, 16px) !important;
  font-weight: var(--svg-comp-upload-button-font-weight, 500) !important;
  line-height: 1.2 !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-editor-frame {
  width: min(var(--svg-comp-image-editor-box-width-percent, 100%), var(--svg-comp-image-editor-box-max-width, 360px), 100%) !important;
  justify-self: var(--svg-comp-image-editor-box-justify-self, center) !important;
  border-color: var(--svg-comp-image-editor-box-border-color, #c3c4c7) !important;
  border-width: var(--svg-comp-image-editor-box-border-width, 1px) !important;
  border-radius: var(--svg-comp-image-editor-box-radius, 0px) !important;
  background-color: var(--svg-comp-image-editor-box-background-color, #ffffff) !important;
  color: var(--svg-comp-image-editor-box-color, var(--svg-wizard-muted)) !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-compactbar {
  padding: var(--svg-comp-image-action-bar-padding-y, 10px) var(--svg-comp-image-action-bar-padding-x, 12px) !important;
  border-color: var(--svg-comp-image-action-bar-border-color, var(--svg-wizard-line)) !important;
  border-width: var(--svg-comp-image-action-bar-border-width, 1px) !important;
  border-radius: var(--svg-comp-image-action-bar-radius, 10px) !important;
  background: var(--svg-comp-image-action-bar-background-color, #ffffff) !important;
  color: var(--svg-comp-image-action-bar-color, var(--svg-wizard-muted)) !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-tools-card {
  padding: var(--svg-comp-image-tools-panel-padding-y, 12px) var(--svg-comp-image-tools-panel-padding-x, 12px) !important;
  border-color: var(--svg-comp-image-tools-panel-border-color, var(--svg-wizard-line)) !important;
  border-width: var(--svg-comp-image-tools-panel-border-width, 1px) !important;
  border-radius: var(--svg-comp-image-tools-panel-radius, 10px) !important;
  background: var(--svg-comp-image-tools-panel-background-color, #ffffff) !important;
  color: var(--svg-comp-image-tools-panel-color, var(--svg-wizard-text)) !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-range-row span,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-range-row em,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-controls-title {
  color: var(--svg-comp-image-slider-text-color, var(--svg-wizard-muted)) !important;
  font-family: var(--svg-comp-image-slider-text-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-image-slider-text-font-size, 12px) !important;
  font-weight: var(--svg-comp-image-slider-text-font-weight, 600) !important;
  line-height: var(--svg-comp-image-slider-text-line-height, 1.35) !important;
}
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-quality-warning {
  padding: var(--svg-comp-image-quality-warning-padding-y, 8px) var(--svg-comp-image-quality-warning-padding-x, 10px) !important;
  border-left-color: var(--svg-comp-image-quality-warning-border-color, #dba617) !important;
  border-left-width: var(--svg-comp-image-quality-warning-border-width, 3px) !important;
  border-radius: var(--svg-comp-image-quality-warning-radius, 6px) !important;
  background: var(--svg-comp-image-quality-warning-background-color, #fff8e5) !important;
  color: var(--svg-comp-image-quality-warning-color, #604600) !important;
  font-family: var(--svg-comp-image-quality-warning-font-family, var(--svg-wizard-font-family)) !important;
  font-size: var(--svg-comp-image-quality-warning-font-size, 13px) !important;
  font-weight: var(--svg-comp-image-quality-warning-font-weight, 400) !important;
  line-height: var(--svg-comp-image-quality-warning-line-height, 1.4) !important;
}

/* v1.0.128 fix missing uploadButtonStyle default helper */


/* v1.0.130 Kundenbild-Upload button/radius binding fixes */
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-button,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-compactactions .svg-template-upload-button,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-upload-dropzone .svg-template-upload-button,
.svg-template-fullscreen-fields .svg-template-image-upload-field .svg-template-image-actions .svg-template-upload-button {
  min-height: calc(var(--svg-comp-upload-button-font-size, 16px) + var(--svg-comp-upload-button-padding-y, 14px) + var(--svg-comp-upload-button-padding-y, 14px) + 2px) !important;
  padding: var(--svg-comp-upload-button-padding-y, 14px) var(--svg-comp-upload-button-padding-x, 24px) !important;
  border: var(--svg-comp-upload-button-border-width, 0px) solid var(--svg-comp-upload-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-upload-button-radius, 8px) !important;
  background: var(--svg-comp-upload-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-upload-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-upload-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-upload-button-font-size, 16px) !important;
  font-weight: var(--svg-comp-upload-button-font-weight, 500) !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}


/* v1.0.131 Kundenbild-Upload: tauschen-Button binding + slider colors */
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field button.svg-template-upload-button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-dropzone button.svg-template-upload-button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions button.svg-template-upload-button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions button.svg-template-upload-button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-actions .button,
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-upload-compactactions .button-link-delete {
  box-sizing: border-box !important;
  min-height: calc(var(--svg-comp-upload-button-font-size, 16px) + var(--svg-comp-upload-button-padding-y, 14px) + var(--svg-comp-upload-button-padding-y, 14px) + 2px) !important;
  padding: var(--svg-comp-upload-button-padding-y, 14px) var(--svg-comp-upload-button-padding-x, 24px) !important;
  border: var(--svg-comp-upload-button-border-width, 0px) solid var(--svg-comp-upload-button-border-color, var(--svg-wizard-button)) !important;
  border-radius: var(--svg-comp-upload-button-radius, 8px) !important;
  background: var(--svg-comp-upload-button-background-color, var(--svg-wizard-button)) !important;
  color: var(--svg-comp-upload-button-color, var(--svg-wizard-button-text)) !important;
  font-family: var(--svg-comp-upload-button-font-family, var(--svg-wizard-button-font-family)) !important;
  font-size: var(--svg-comp-upload-button-font-size, 16px) !important;
  font-weight: var(--svg-comp-upload-button-font-weight, 500) !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input {
  accent-color: var(--svg-comp-image-slider-color, var(--svg-wizard-brand)) !important;
  background-color: var(--svg-comp-image-slider-background-color, transparent) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input::-webkit-slider-runnable-track {
  background-color: var(--svg-comp-image-slider-track-color, var(--svg-wizard-line));
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input::-webkit-slider-thumb {
  background-color: var(--svg-comp-image-slider-color, var(--svg-wizard-brand));
  border: var(--svg-comp-image-slider-border-width, 0px) solid var(--svg-comp-image-slider-border-color, var(--svg-comp-image-slider-color, var(--svg-wizard-brand)));
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input::-moz-range-track {
  background-color: var(--svg-comp-image-slider-track-color, var(--svg-wizard-line));
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input::-moz-range-thumb {
  background-color: var(--svg-comp-image-slider-color, var(--svg-wizard-brand));
  border: var(--svg-comp-image-slider-border-width, 0px) solid var(--svg-comp-image-slider-border-color, var(--svg-comp-image-slider-color, var(--svg-wizard-brand)));
}


/* v1.0.136 customer image upload slider visibility + scoped slider colors */
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-tools-card:not([hidden]),
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-image-controls:not([hidden]) {
  display: grid !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-range-row {
  display: grid !important;
  grid-template-columns: 80px minmax(120px, 1fr) 52px;
  gap: 8px;
  align-items: center;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input[type="range"] {
  display: block !important;
  width: 100% !important;
  min-width: 120px;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  accent-color: var(--svg-comp-image-slider-color, var(--svg-wizard-brand)) !important;
  -webkit-appearance: none;
  appearance: none;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input[type="range"]::-webkit-slider-runnable-track {
  height: 6px !important;
  border-radius: 999px !important;
  background: var(--svg-comp-image-slider-track-color, var(--svg-wizard-line)) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 18px !important;
  height: 18px !important;
  margin-top: -6px !important;
  border-radius: 999px !important;
  border: var(--svg-comp-image-slider-border-width, 0px) solid var(--svg-comp-image-slider-border-color, var(--svg-comp-image-slider-color, var(--svg-wizard-brand))) !important;
  background: var(--svg-comp-image-slider-color, var(--svg-wizard-brand)) !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.22) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input[type="range"]::-moz-range-track {
  height: 6px !important;
  border-radius: 999px !important;
  background: var(--svg-comp-image-slider-track-color, var(--svg-wizard-line)) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field input.svg-template-range-input[type="range"]::-moz-range-thumb {
  width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  border: var(--svg-comp-image-slider-border-width, 0px) solid var(--svg-comp-image-slider-border-color, var(--svg-comp-image-slider-color, var(--svg-wizard-brand))) !important;
  background: var(--svg-comp-image-slider-color, var(--svg-wizard-brand)) !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.22) !important;
}
@media (max-width: 782px) {
  .svg-template-wizard-app .svg-template-fullscreen-editor-panel .svg-template-image-upload-field .svg-template-range-row {
    grid-template-columns: 1fr;
  }
}

/* v1.0.156: isolate wizard canvas arrows from WooCommerce/theme button CSS */
.svg-template-wizard-app .svg-template-fullscreen-card-area {
  position: relative !important;
  isolation: isolate !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 60 !important;
  pointer-events: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow,
.svg-template-wizard-app .svg-template-fullscreen-card-area .svg-template-fullscreen-arrow {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: absolute !important;
  top: 50% !important;
  display: grid !important;
  place-items: center !important;
  width: var(--svg-wizard-arrow-size, 68px) !important;
  height: var(--svg-wizard-arrow-size, 68px) !important;
  min-width: var(--svg-wizard-arrow-size, 68px) !important;
  min-height: var(--svg-wizard-arrow-size, 68px) !important;
  max-width: var(--svg-wizard-arrow-size, 68px) !important;
  max-height: var(--svg-wizard-arrow-size, 68px) !important;
  margin: 0 !important;
  padding: 0 !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--svg-wizard-arrow-border, #ffffff) !important;
  border-radius: var(--svg-wizard-arrow-radius, 999px) !important;
  background: color-mix(in srgb, var(--svg-wizard-arrow-bg, #ffffff) var(--svg-wizard-arrow-bg-opacity, 94%), transparent) !important;
  color: var(--svg-wizard-arrow-color, #15110e) !important;
  box-shadow: var(--svg-wizard-arrow-shadow, 0 18px 50px rgba(42,31,23,.12)) !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: none !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  pointer-events: auto !important;
  z-index: 61 !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow-left {
  left: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
  right: auto !important;
  transform: translateY(-50%) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow-right {
  right: clamp(10px, 3vw, var(--svg-wizard-arrow-offset, 32px)) !important;
  left: auto !important;
  transform: translateY(-50%) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow:hover,
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow:focus {
  background: color-mix(in srgb, var(--svg-wizard-arrow-hover-bg, #ffffff) var(--svg-wizard-arrow-hover-bg-opacity, 100%), transparent) !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow svg {
  display: block !important;
  width: var(--svg-wizard-arrow-icon-size, 28px) !important;
  height: var(--svg-wizard-arrow-icon-size, 28px) !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  pointer-events: none !important;
}
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow[hidden],
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow.is-hidden,
.svg-template-wizard-app .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow-left {
  left: clamp(8px, 3vw, 18px) !important;
}
.svg-template-wizard-app[data-responsive-mode="mobile"] .svg-template-fullscreen-arrow-layer .svg-template-fullscreen-arrow-right {
  right: clamp(8px, 3vw, 18px) !important;
}

/* v1.0.156: customer cancel confirmation overlay */
.svg-template-cancel-overlay[hidden] {
  display: none !important;
}
.svg-template-cancel-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483646 !important;
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background: transparent !important;
}
.svg-template-cancel-overlay::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--svg-wizard-cancel-overlay-color, #15110e) !important;
  opacity: var(--svg-wizard-cancel-overlay-opacity, .54) !important;
}
.svg-template-cancel-dialog {
  position: relative !important;
  z-index: 1 !important;
  width: min(100%, var(--svg-wizard-cancel-max-width, 460px)) !important;
  padding: var(--svg-wizard-cancel-padding, 28px) !important;
  border: var(--svg-wizard-cancel-border-width, 1px) solid var(--svg-wizard-cancel-border, #e6dfd8) !important;
  border-radius: var(--svg-wizard-cancel-radius, 18px) !important;
  background: var(--svg-wizard-cancel-bg, #ffffff) !important;
  color: var(--svg-wizard-cancel-text, #15110e) !important;
  box-shadow: var(--svg-wizard-cancel-shadow, 0 24px 80px rgba(0,0,0,.22)) !important;
  font-family: var(--svg-wizard-font-family, inherit) !important;
  text-align: left !important;
  box-sizing: border-box !important;
}
.svg-template-cancel-title {
  margin: 0 0 10px !important;
  color: var(--svg-wizard-cancel-title, #15110e) !important;
  font-family: var(--svg-wizard-heading-font-family, inherit) !important;
  font-size: clamp(22px, 3vw, 30px) !important;
  line-height: 1.15 !important;
}
.svg-template-cancel-text {
  margin: 0 0 24px !important;
  color: var(--svg-wizard-cancel-text, #15110e) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}
.svg-template-cancel-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.svg-template-cancel-actions .svg-template-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 12px 18px !important;
  margin: 0 !important;
  border-radius: var(--svg-wizard-cancel-button-radius, 8px) !important;
  border: 1px solid var(--svg-wizard-cancel-border, #e6dfd8) !important;
  font-family: var(--svg-wizard-button-font-family, inherit) !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}
.svg-template-cancel-continue {
  background: var(--svg-wizard-cancel-continue-bg, #ffffff) !important;
  color: var(--svg-wizard-cancel-continue-text, #15110e) !important;
}
.svg-template-cancel-confirm {
  background: var(--svg-wizard-cancel-confirm-bg, #c5b29f) !important;
  color: var(--svg-wizard-cancel-confirm-text, #fffaf5) !important;
  border-color: var(--svg-wizard-cancel-confirm-bg, #c5b29f) !important;
}
.svg-template-customer-done-message {
  margin: 0 !important;
  color: var(--svg-wizard-text, #15110e) !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
}
@media (max-width: 560px) {
  .svg-template-cancel-actions { flex-direction: column-reverse !important; }
  .svg-template-cancel-actions .svg-template-button { width: 100% !important; }
}

.svg-template-cart-overlay[hidden] { display: none !important; }
.svg-template-cart-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483646 !important;
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background: var(--svg-cart-overlay-bg, rgba(21,17,14,.54)) !important;
}
.svg-template-cart-dialog {
  position: relative !important;
  width: min(100%, 560px) !important;
  max-height: min(760px, calc(100dvh - 48px)) !important;
  overflow: auto !important;
  padding: 28px !important;
  border: 1px solid var(--svg-cart-border, var(--svg-wizard-border, #e6dfd8)) !important;
  border-radius: var(--svg-cart-dialog-radius, 18px) !important;
  background: var(--svg-cart-dialog-bg, #fff) !important;
  color: var(--svg-cart-text, var(--svg-wizard-text, #15110e)) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.22) !important;
  font-family: var(--svg-wizard-font-family, inherit) !important;
  box-sizing: border-box !important;
}
.svg-template-cart-title { margin: 0 0 8px !important; font-family: var(--svg-wizard-heading-font-family, inherit) !important; color: var(--svg-cart-title-color, var(--svg-wizard-text, #15110e)) !important; font-size: clamp(22px, 3vw, 30px) !important; line-height: 1.15 !important; }
.svg-template-cart-intro { margin: 0 0 16px !important; color: var(--svg-cart-muted, var(--svg-wizard-muted, #6f6861)) !important; line-height: 1.5 !important; }
.svg-template-cart-product { margin: 0 0 16px !important; font-weight: 700 !important; }
.svg-template-cart-price-row { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 12px !important; padding: 14px 0 !important; border-top: 1px solid #e6dfd8 !important; border-bottom: 1px solid #e6dfd8 !important; }
.svg-template-cart-unit-price { font-size: 22px !important; color: var(--svg-cart-accent, var(--svg-wizard-accent, #8d6e50)) !important; }
.svg-template-cart-tier-wrap { margin: 18px 0 !important; }
.svg-template-cart-tier-wrap h3 { margin: 0 0 8px !important; font-size: 15px !important; }
.svg-template-cart-tier-table { width: 100% !important; border-collapse: collapse !important; font-size: 14px !important; }
.svg-template-cart-tier-table td { padding: 8px 10px !important; border-bottom: 1px solid #eee !important; }
.svg-template-cart-tier-table td:last-child { text-align: right !important; font-weight: 700 !important; }
.svg-template-cart-tier-table tr.is-active td { background: #f6f1ec !important; }
.svg-template-cart-legal { margin: -8px 0 16px !important; color: var(--svg-cart-muted, var(--svg-wizard-muted, #6f6861)) !important; font-size: 12px !important; line-height: 1.4 !important; max-width: 360px !important; }
.svg-template-cart-legal a { color: var(--svg-cart-accent, var(--svg-wizard-accent, #8d6e50)) !important; }
.svg-template-cart-quantity-label { display: grid !important; gap: 6px !important; margin: 18px 0 12px !important; font-weight: 700 !important; }
.svg-template-cart-quantity { width: 140px !important; min-height: 44px !important; padding: 8px 12px !important; border: 1px solid #dcdcde !important; border-radius: 8px !important; font-size: 16px !important; }
.svg-template-cart-summary { margin: 10px 0 18px !important; font-size: 18px !important; color: var(--svg-cart-accent, var(--svg-wizard-accent, #8d6e50)) !important; }
.svg-template-cart-actions { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 18px !important; margin-top: 18px !important; }
.svg-template-cart-actions-left { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important; min-width: 0 !important; }
.svg-template-cart-actions-right { display: flex !important; align-items: center !important; justify-content: flex-end !important; min-width: 0 !important; }
.svg-template-cart-actions .svg-template-button { min-height: 44px !important; padding: 12px 18px !important; margin: 0 !important; border-radius: var(--svg-cart-button-radius, var(--svg-wizard-radius, 8px)) !important; white-space: nowrap !important; }
.svg-template-cart-add { background: var(--svg-cart-add-bg, var(--svg-wizard-button, #c5b29f)) !important; color: var(--svg-cart-add-text, var(--svg-wizard-button-text, #fffaf5)) !important; border-color: var(--svg-cart-add-bg, var(--svg-wizard-button, #c5b29f)) !important; }
.svg-template-cart-edit { background: var(--svg-cart-edit-bg, #fff) !important; color: var(--svg-cart-edit-text, var(--svg-wizard-text, #15110e)) !important; border: 1px solid var(--svg-cart-edit-border, #dcdcde) !important; }
.svg-template-cart-notice { margin: 14px 0 0 !important; padding: 10px 12px !important; border-radius: 8px !important; background: #f0f6fc !important; color: #0a4b78 !important; }

.svg-template-cart-loading[hidden] { display: none !important; }
.svg-template-cart-loading {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  border-radius: var(--svg-cart-dialog-radius, 18px) !important;
  background: color-mix(in srgb, var(--svg-cart-dialog-bg, #fff) 86%, transparent) !important;
  backdrop-filter: blur(2px) !important;
}
.svg-template-cart-loading-box {
  display: grid !important;
  justify-items: center !important;
  gap: 8px !important;
  width: min(100%, 320px) !important;
  padding: 22px !important;
  border: 1px solid var(--svg-cart-border, #e6dfd8) !important;
  border-radius: 14px !important;
  background: var(--svg-cart-dialog-bg, #fff) !important;
  color: var(--svg-cart-text, #15110e) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,.18) !important;
  text-align: center !important;
}
.svg-template-cart-loading-box strong { color: var(--svg-cart-title-color, #15110e) !important; }
.svg-template-cart-loading-box span:not(.svg-template-cart-loading-spinner) { color: var(--svg-cart-muted, #6f6861) !important; font-size: 13px !important; }
.svg-template-cart-loading-spinner {
  width: 30px !important;
  height: 30px !important;
  border: 3px solid color-mix(in srgb, var(--svg-cart-accent, #8d6e50) 20%, #fff) !important;
  border-top-color: var(--svg-cart-accent, #8d6e50) !important;
  border-radius: 999px !important;
  animation: svg-template-spin .8s linear infinite !important;
}
@supports not (background: color-mix(in srgb, #000 10%, #fff)) {
  .svg-template-cart-loading { background: rgba(255,255,255,.86) !important; }
}
@media (max-width: 560px) {
  .svg-template-cart-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 10px !important; }
  .svg-template-cart-actions-left, .svg-template-cart-actions-right { width: auto !important; min-width: 0 !important; }
  .svg-template-cart-actions-left { justify-content: flex-start !important; }
  .svg-template-cart-actions-right { justify-content: flex-end !important; }
  .svg-template-cart-actions .svg-template-button { width: 100% !important; padding-left: 10px !important; padding-right: 10px !important; white-space: normal !important; }
  .svg-template-cart-legal { max-width: none !important; }
}

/* v1.0.182 personalized cart rows: tier price is not a sale price */
.woocommerce-cart-form .cart_item.svg-template-personalized-cart-item .product-price del,
.woocommerce-cart-form .cart_item.svg-template-personalized-cart-item .product-subtotal del,
.woocommerce-cart-form .cart_item.svg-template-personalized-cart-item del,
.widget_shopping_cart .svg-template-personalized-cart-item del,
.woocommerce-mini-cart .svg-template-personalized-cart-item del {
  display: none !important;
}
.woocommerce-cart-form .cart_item.svg-template-personalized-cart-item .product-price ins,
.woocommerce-cart-form .cart_item.svg-template-personalized-cart-item .product-subtotal ins,
.widget_shopping_cart .svg-template-personalized-cart-item ins,
.woocommerce-mini-cart .svg-template-personalized-cart-item ins {
  text-decoration: none !important;
  background: transparent !important;
}
.svg-template-personalized-cart-legal {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.35;
}
.svg-template-personalized-cart-legal .wgm-info {
  display: block;
}

/* v1.0.182 compact product page tier prices below from-price */
.svg-template-product-tier-prices {
  display: grid;
  gap: 3px;
  margin: 6px 0 8px;
  font-size: 0.875em;
  line-height: 1.35;
  color: inherit;
}
.svg-template-product-tier-title {
  font-weight: 600;
}
.svg-template-product-tier-row {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: flex-start;
}
.svg-template-product-tier-range {
  min-width: 7.5em;
}
.svg-template-product-tier-price {
  font-weight: 500;
}

/* v1.0.182 smaller unit suffix for personalized from/tier prices */
.svg-template-from-price .svg-template-price-unit,
.svg-template-product-tier-price .svg-template-price-unit {
  font-size: 0.72em;
  font-weight: 400;
  opacity: 0.75;
  white-space: nowrap;
}

/* v1.0.182 product page: from-price unit uses the same subtle size as tier-price units */
body.single-product .svg-template-from-price .svg-template-price-unit,
.single-product .svg-template-from-price .svg-template-price-unit {
  font-size: 0.72em;
  font-weight: 400;
  opacity: 0.75;
  white-space: nowrap;
}


/* v1.0.182 cart personalization SVG preview */
.svg-template-cart-preview-button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 0.92em;
  text-decoration: underline;
  cursor: pointer;
}
body.svg-template-cart-preview-open {
  overflow: hidden;
}
.svg-template-cart-preview-modal[hidden] {
  display: none !important;
}
.svg-template-cart-preview-modal {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: grid;
  place-items: center;
  padding: 22px;
}
.svg-template-cart-preview-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.54);
}
.svg-template-cart-preview-dialog {
  position: relative;
  z-index: 1;
  width: min(920px, 96vw);
  max-height: min(860px, 94vh);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 22px;
  border-radius: 18px;
  background: #fff;
  color: #15110e;
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  overflow: hidden;
}
.svg-template-cart-preview-x {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.svg-template-cart-preview-head {
  display: grid;
  gap: 3px;
  padding-right: 40px;
}
.svg-template-cart-preview-head strong {
  font-size: 20px;
  line-height: 1.2;
}
.svg-template-cart-preview-subtitle {
  color: #6f6861;
  font-size: 13px;
}
.svg-template-cart-preview-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.svg-template-cart-preview-tabs button {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid #dcdcde;
  border-radius: 999px;
  background: #fff;
  color: inherit;
  cursor: pointer;
}
.svg-template-cart-preview-tabs button.is-active {
  border-color: #8d6e50;
  background: #f4efe9;
  color: #15110e;
  font-weight: 600;
}
.svg-template-cart-preview-body {
  min-height: 220px;
  overflow: auto;
  display: grid;
  place-items: center;
  padding: 18px;
  border: 1px solid #e6dfd8;
  border-radius: 12px;
  background: #f6f1ec;
}
.svg-template-cart-preview-svg-wrap {
  width: min(100%, 620px);
  display: grid;
  place-items: center;
}
.svg-template-cart-preview-svg-wrap svg {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: min(62vh, 620px);
  height: auto;
  background: #fff;
  box-shadow: 0 14px 45px rgba(48,35,24,.16);
}
.svg-template-cart-preview-loading,
.svg-template-cart-preview-error {
  padding: 18px;
  border-radius: 10px;
  background: #fff;
  text-align: center;
}
.svg-template-cart-preview-error {
  color: #8a2424;
}
.svg-template-cart-preview-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
@media (max-width: 640px) {
  .svg-template-cart-preview-modal {
    padding: 10px;
  }
  .svg-template-cart-preview-dialog {
    padding: 16px;
    border-radius: 14px;
  }
  .svg-template-cart-preview-body {
    padding: 10px;
  }
}

/* v1.0.182 compact cart SVG preview modal */
.svg-template-cart-preview-dialog {
  width: min(720px, 94vw);
  max-height: min(720px, 88vh);
  gap: 10px;
  padding: 18px;
  padding-top: 16px;
  border-radius: 16px;
  overflow: hidden;
}
.svg-template-cart-preview-x {
  top: 8px;
  right: 8px;
  z-index: 5;
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  font-size: 24px !important;
  box-shadow: none !important;
  border-radius: 999px;
}
.svg-template-cart-preview-x:hover,
.svg-template-cart-preview-x:focus {
  background: #f6f1ec;
  outline: none;
}
.svg-template-cart-preview-head {
  padding-right: 34px;
}
.svg-template-cart-preview-head strong {
  font-size: 18px;
}
.svg-template-cart-preview-body {
  min-height: 160px;
  max-height: 54vh;
  padding: 14px;
}
.svg-template-cart-preview-svg-wrap {
  width: min(100%, 480px);
}
.svg-template-cart-preview-svg-wrap svg {
  max-height: min(46vh, 460px);
}
.svg-template-cart-preview-tabs button {
  min-height: 28px;
  padding: 0 10px;
  font-size: 13px;
}
.svg-template-cart-preview-actions .button {
  min-height: 32px;
  line-height: 30px;
  padding: 0 12px;
}
@media (max-width: 640px) {
  .svg-template-cart-preview-dialog {
    width: min(520px, 94vw);
    max-height: 86vh;
    padding: 14px;
    border-radius: 14px;
  }
  .svg-template-cart-preview-body {
    min-height: 130px;
    max-height: 50vh;
    padding: 8px;
  }
  .svg-template-cart-preview-svg-wrap {
    width: min(100%, 360px);
  }
  .svg-template-cart-preview-svg-wrap svg {
    max-height: min(42vh, 340px);
  }
}

/* v1.0.185 cart preview edit action */
.svg-template-cart-preview-actions {
  grid-template-columns: auto auto;
  justify-content: end;
}
.svg-template-cart-preview-edit[hidden] {
  display: none !important;
}

/* v1.0.185 cart preview edit action as primary button */
.svg-template-cart-preview-edit {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 14px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  cursor: pointer;
}

/* v1.0.190 production data overview */
.svg-template-production-admin .svg-production-preview-svg svg {
  display: block;
  max-width: 100%;
  height: auto;
}
.svg-template-production-admin table .button {
  margin: 0 0 4px;
}
@media (max-width: 782px) {
  .svg-template-production-admin .svg-production-summary {
    grid-template-columns: 1fr !important;
  }
}


/* v1.0.200 Astra/German-Market Mini-Cart cleanup for personalized items */
.widget_shopping_cart .svg-template-personalized-cart-item dl.variation,
.woocommerce-mini-cart .svg-template-personalized-cart-item dl.variation,
.astra-cart-drawer .svg-template-personalized-cart-item dl.variation {
  display: none !important;
}
.widget_shopping_cart .svg-template-personalized-cart-item .svg-template-mini-cart-price,
.woocommerce-mini-cart .svg-template-personalized-cart-item .svg-template-mini-cart-price,
.astra-cart-drawer .svg-template-personalized-cart-item .svg-template-mini-cart-price {
  display: block;
  margin-top: 2px;
  font-weight: 600;
}
.widget_shopping_cart .svg-template-personalized-cart-item .svg-template-personalized-cart-legal,
.woocommerce-mini-cart .svg-template-personalized-cart-item .svg-template-personalized-cart-legal,
.astra-cart-drawer .svg-template-personalized-cart-item .svg-template-personalized-cart-legal,
.svg-template-mini-cart-total-legal {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 400;
}
.widget_shopping_cart .svg-template-personalized-cart-item .svg-template-personalized-cart-legal .wgm-info,
.woocommerce-mini-cart .svg-template-personalized-cart-item .svg-template-personalized-cart-legal .wgm-info,
.astra-cart-drawer .svg-template-personalized-cart-item .svg-template-personalized-cart-legal .wgm-info,
.svg-template-mini-cart-total-legal .wgm-info {
  display: block;
  margin: 0;
}
.woocommerce-mini-cart__total .svg-template-mini-cart-total-legal,
.widget_shopping_cart .total .svg-template-mini-cart-total-legal,
.astra-cart-drawer .total .svg-template-mini-cart-total-legal {
  clear: both;
  padding-top: 4px;
}

/* v1.0.201 Astra Cart Drawer: reduced personalized item data + legal text spacing */
.astra-cart-drawer .svg-template-personalized-cart-item .variation,
.ast-site-header-cart .svg-template-personalized-cart-item .variation {
  display: none !important;
}

.astra-cart-drawer .svg-template-mini-cart-price,
.ast-site-header-cart .svg-template-mini-cart-price {
  display: block;
  margin-top: 0.35em;
  line-height: 1.35;
}

.astra-cart-drawer .svg-template-personalized-cart-legal,
.ast-site-header-cart .svg-template-personalized-cart-legal {
  display: block;
  clear: both;
  margin-top: 0.35em;
  font-size: 12px;
  line-height: 1.45;
  color: inherit;
}

.astra-cart-drawer .svg-template-personalized-cart-legal .wgm-info,
.ast-site-header-cart .svg-template-personalized-cart-legal .wgm-info,
.astra-cart-drawer .svg-template-personalized-cart-legal small,
.ast-site-header-cart .svg-template-personalized-cart-legal small {
  display: block;
  font-size: inherit;
  line-height: inherit;
}

.astra-cart-drawer .svg-template-personalized-cart-legal a,
.ast-site-header-cart .svg-template-personalized-cart-legal a {
  text-decoration: underline;
}

.astra-cart-drawer .svg-template-mini-cart-total-legal,
.ast-site-header-cart .svg-template-mini-cart-total-legal {
  display: block;
  padding: 0 1.34em 1em;
  margin: -0.2em 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: inherit;
}

.astra-cart-drawer .svg-template-mini-cart-total-legal .wgm-info,
.ast-site-header-cart .svg-template-mini-cart-total-legal .wgm-info,
.astra-cart-drawer .svg-template-mini-cart-total-legal small,
.ast-site-header-cart .svg-template-mini-cart-total-legal small {
  display: block;
  font-size: inherit;
  line-height: inherit;
}

.astra-cart-drawer .svg-template-mini-cart-total-legal a,
.ast-site-header-cart .svg-template-mini-cart-total-legal a {
  text-decoration: underline;
}


/* v1.0.202 Astra Mini-Cart spacing + German-Market delivery in cart overlay */
.astra-cart-drawer .svg-template-mini-cart-total-legal,
.ast-site-header-cart .svg-template-mini-cart-total-legal {
  padding: 0.8em 1.34em 0.75em !important;
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.astra-cart-drawer .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message),
.ast-site-header-cart .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message),
.astra-cart-drawer .widget_shopping_cart_content > .woocommerce-de_info,
.ast-site-header-cart .widget_shopping_cart_content > .woocommerce-de_info,
.astra-cart-drawer .widget_shopping_cart_content > .wgm-info,
.ast-site-header-cart .widget_shopping_cart_content > .wgm-info {
  display: block !important;
  padding: 0 1.34em 1em !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  box-sizing: border-box !important;
}

.svg-template-cart-legal .wgm-info,
.svg-template-cart-legal .woocommerce-de_price_taxrate,
.svg-template-cart-legal .woocommerce_de_versandkosten,
.svg-template-cart-legal .shipping_de,
.svg-template-cart-legal small {
  display: block !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* v1.0.203 modular mini-cart compatibility profiles */
body.svg-template-mini-cart-profile-disabled .woocommerce-mini-cart .svg-template-personalized-cart-item dl.variation,
body.svg-template-mini-cart-profile-disabled .widget_shopping_cart .svg-template-personalized-cart-item dl.variation,
body.svg-template-mini-cart-profile-disabled .astra-cart-drawer .svg-template-personalized-cart-item dl.variation,
body.svg-template-mini-cart-profile-disabled .ast-site-header-cart .svg-template-personalized-cart-item dl.variation,
body.svg-template-mini-cart-profile-disabled .astra-cart-drawer .svg-template-personalized-cart-item .variation,
body.svg-template-mini-cart-profile-disabled .ast-site-header-cart .svg-template-personalized-cart-item .variation {
  display: block !important;
}

body.svg-template-mini-cart-profile-disabled .svg-template-mini-cart-total-legal,
body.svg-template-mini-cart-profile-disabled .svg-template-mini-cart-price,
body.svg-template-mini-cart-profile-disabled .svg-template-personalized-cart-legal {
  display: none !important;
}

body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0.7em 1.34em !important;
  margin-bottom: 0 !important;
  text-align: left !important;
}

body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total strong,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total strong {
  width: auto !important;
  flex: 1 1 auto !important;
  min-width: max-content !important;
  white-space: nowrap !important;
  text-align: left !important;
  padding-right: 0 !important;
}

body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total .amount,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total .amount {
  width: auto !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  text-align: right !important;
}

body.svg-template-mini-cart-profile-astra .astra-cart-drawer .svg-template-mini-cart-total-legal,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .svg-template-mini-cart-total-legal {
  padding: 0.65em 1.34em 0.75em !important;
  border-top: 1px solid var(--ast-border-color, #d9d3cb);
}

body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message),
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message),
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > .woocommerce-de_info,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > .woocommerce-de_info,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > .wgm-info,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > .wgm-info {
  padding-left: 1.34em !important;
  padding-right: 1.34em !important;
}


/* v1.0.204 Astra mini-cart profile hardening: remove button, subtotal line and legal spacing */
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart-item,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart-item,
.ast-site-header-cart .svg-template-personalized-cart-item,
.astra-cart-drawer .svg-template-personalized-cart-item {
  position: relative !important;
  padding-right: 2.75em !important;
  box-sizing: border-box !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart-item a.remove,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart-item a.remove,
.ast-site-header-cart .svg-template-personalized-cart-item a.remove,
.astra-cart-drawer .svg-template-personalized-cart-item a.remove {
  position: absolute !important;
  top: 0.9em !important;
  right: 0.85em !important;
  left: auto !important;
  margin: 0 !important;
  z-index: 5 !important;
  float: none !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart-item > a:not(.remove),
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart-item > a:not(.remove),
.ast-site-header-cart .svg-template-personalized-cart-item > a:not(.remove),
.astra-cart-drawer .svg-template-personalized-cart-item > a:not(.remove) {
  padding-right: 1.75em !important;
  box-sizing: border-box !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total,
.ast-site-header-cart .woocommerce-mini-cart__total,
.astra-cart-drawer .woocommerce-mini-cart__total {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 1em !important;
  padding: 0.8em 1.34em !important;
  margin: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total strong,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total strong,
.ast-site-header-cart .woocommerce-mini-cart__total strong,
.astra-cart-drawer .woocommerce-mini-cart__total strong {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  text-align: left !important;
  padding-right: 0 !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .woocommerce-mini-cart__total .amount,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .woocommerce-mini-cart__total .amount,
.ast-site-header-cart .woocommerce-mini-cart__total .amount,
.astra-cart-drawer .woocommerce-mini-cart__total .amount {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  text-align: right !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > .svg-template-mini-cart-total-legal,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > .svg-template-mini-cart-total-legal,
.ast-site-header-cart .widget_shopping_cart_content > .svg-template-mini-cart-total-legal,
.astra-cart-drawer .widget_shopping_cart_content > .svg-template-mini-cart-total-legal {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0.85em 1.34em 0.7em !important;
  margin: 0 !important;
  border-top: 1px solid var(--ast-border-color, #d9d3cb) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message):not(.woocommerce-mini-cart__total):not(.woocommerce-mini-cart__buttons),
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message):not(.woocommerce-mini-cart__total):not(.woocommerce-mini-cart__buttons),
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > .woocommerce-de_info,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > .woocommerce-de_info,
body.svg-template-mini-cart-profile-astra .ast-site-header-cart .widget_shopping_cart_content > .wgm-info,
body.svg-template-mini-cart-profile-astra .astra-cart-drawer .widget_shopping_cart_content > .wgm-info,
.ast-site-header-cart .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message):not(.woocommerce-mini-cart__total):not(.woocommerce-mini-cart__buttons),
.astra-cart-drawer .widget_shopping_cart_content > p:not(.woocommerce-mini-cart__empty-message):not(.woocommerce-mini-cart__total):not(.woocommerce-mini-cart__buttons),
.ast-site-header-cart .widget_shopping_cart_content > .woocommerce-de_info,
.astra-cart-drawer .widget_shopping_cart_content > .woocommerce-de_info,
.ast-site-header-cart .widget_shopping_cart_content > .wgm-info,
.astra-cart-drawer .widget_shopping_cart_content > .wgm-info {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 1.34em 1em !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

body.svg-template-mini-cart-profile-disabled .ast-site-header-cart .woocommerce-mini-cart-item,
body.svg-template-mini-cart-profile-disabled .astra-cart-drawer .woocommerce-mini-cart-item,
body.svg-template-mini-cart-profile-disabled .ast-site-header-cart .svg-template-personalized-cart-item,
body.svg-template-mini-cart-profile-disabled .astra-cart-drawer .svg-template-personalized-cart-item {
  padding-right: initial !important;
}

body.svg-template-mini-cart-profile-disabled .ast-site-header-cart .woocommerce-mini-cart-item a.remove,
body.svg-template-mini-cart-profile-disabled .astra-cart-drawer .woocommerce-mini-cart-item a.remove {
  position: static !important;
  float: inherit !important;
}

/* v1.0.206: v1.0.205 mobile WooCommerce cart container shift was reverted. */

/* v1.0.209: Astra theme profile scoped WooCommerce Blocks alignwide containment.
   The cart and checkout pages can use WooCommerce Blocks with alignwide. Astra can
   apply negative alignwide margins on tablet/mobile; neutralize only these blocks
   when the active Theme Compatibility Profile is Astra. */
@media (max-width: 921px) {
  body.svg-template-theme-profile-astra.woocommerce-cart .entry-content[data-ast-blocks-layout] > .wp-block-woocommerce-cart.alignwide,
  body.svg-template-theme-profile-astra.woocommerce-checkout .entry-content[data-ast-blocks-layout] > .wp-block-woocommerce-checkout.alignwide {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* v1.0.211 cart/checkout unit-price suffix */
.svg-template-cart-unit-price {
  white-space: nowrap;
}

.svg-template-cart-unit-price-suffix {
  font-size: 0.86em;
  font-weight: 400;
  opacity: 0.78;
}

body.woocommerce-cart .wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price__value::after,
body.woocommerce-checkout .wc-block-components-order-summary-item__individual-prices .wc-block-components-product-price__value::after {
  content: " / Stück";
  font-size: 0.86em;
  font-weight: 400;
  opacity: 0.78;
  white-space: nowrap;
}

/* v1.0.212 tier-price overlay and compact mini-cart legal markers */
.svg-template-tier-price-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  text-decoration: underline !important;
  cursor: pointer !important;
}
.svg-template-tier-price-modal[hidden] {
  display: none !important;
}
.svg-template-tier-price-dialog {
  width: min(100%, 560px) !important;
}
.svg-template-tier-price-body {
  margin: 12px 0 16px !important;
}
.svg-template-tier-price-table td:first-child {
  color: var(--svg-cart-text, #15110e) !important;
}
.svg-template-tier-price-table td:last-child {
  color: var(--svg-cart-accent, #8d6e50) !important;
  white-space: nowrap !important;
}
.svg-template-tier-price-legal {
  margin-top: 0 !important;
  max-width: none !important;
}
.svg-template-tier-price-legal .wgm-info,
.svg-template-tier-price-legal .woocommerce-de_price_taxrate,
.svg-template-tier-price-legal .woocommerce_de_versandkosten,
.svg-template-tier-price-legal .shipping_de,
.svg-template-tier-price-legal small {
  display: block !important;
  font-size: inherit !important;
  line-height: inherit !important;
  margin: 0 !important;
}
.svg-template-tier-price-actions {
  margin-top: 14px !important;
}


/* Placeholder behavior help in template designer */
.svg-placeholder-behavior-row .svg-placeholder-behavior-controls{display:flex;align-items:center;gap:6px;width:100%}
.svg-placeholder-behavior-row .svg-placeholder-behavior-controls select{flex:1 1 auto;min-width:0}
.svg-placeholder-help-button{min-width:28px;height:28px;border-radius:999px!important;font-weight:700!important;line-height:1!important;padding:0!important}
.svg-placeholder-help-overlay{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box}
.svg-placeholder-help-backdrop{position:absolute;inset:0;background:rgba(21,17,14,.46)}
.svg-placeholder-help-dialog{position:relative;z-index:1;width:min(620px,100%);max-height:calc(100vh - 48px);overflow:auto;background:#fff;color:#15110e;border:1px solid #e6dfd8;border-radius:16px;box-shadow:0 20px 80px rgba(21,17,14,.22);padding:24px 28px;box-sizing:border-box}
.svg-placeholder-help-dialog h3{margin:0 0 14px;font-size:20px;line-height:1.25}
.svg-placeholder-help-dialog dl{margin:0;display:grid;gap:10px}
.svg-placeholder-help-dialog dt{font-weight:700;margin:0;color:#15110e}
.svg-placeholder-help-dialog dd{margin:2px 0 0;color:#4a4540;line-height:1.45}
.svg-placeholder-help-dialog p{margin:14px 0 0;line-height:1.5;color:#4a4540}
.svg-placeholder-help-close{position:absolute;top:10px;right:12px;border:0;background:transparent;font-size:24px;line-height:1;cursor:pointer;color:#15110e}
.svg-template-preview-svg .svg-template-placeholder-text{pointer-events:none}


/* v1.0.249 Kundenbild-Druckrahmen im Wizard als Ja/Nein-Dropdown */
.svg-template-frame-toggle {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(96px, 130px);
  align-items: center;
  gap: 10px;
  font-weight: 600;
  margin: 0 0 10px;
}
.svg-template-frame-toggle select {
  width: 100%;
  min-height: var(--svg-wizard-field-height, 42px);
}
.svg-template-frame-toggle[hidden] {
  display: none !important;
}
@media (max-width: 480px) {
  .svg-template-frame-toggle {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

/* v1.0.253 single-unit price + tier-price link in product loops */
.svg-template-loop-tier-link-wrap {
  font-size: .82em;
  white-space: nowrap;
}
.svg-template-loop-tier-price-button {
  appearance: none;
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.svg-template-loop-tier-price-button:hover,
.svg-template-loop-tier-price-button:focus-visible {
  text-decoration-thickness: 2px;
}
.svg-template-loop-tier-price-button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}