/* Invitations DYO Editor — pixel mockup styles (scoped) */

.idyo-editor {
  --bg-page: #f2efe8;
  --cream: #ece7db;
  --card-border: #c6a55c;
  --card-border-outer: #b89a52;
  --text-dark: #2b2620;
  --gold: #b8860b;
  --brand-purple: #9b51e0;
  --brand-pink: #af3c7e;
  --panel-header: #e7e2d5;
  --divider: #ddd7c8;
  background: var(--bg-page);
  font-family: 'EB Garamond', serif;
  color: var(--text-dark);
  padding: 28px 16px 40px;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

.idyo-editor *,
.idyo-editor *::before,
.idyo-editor *::after {
  box-sizing: border-box;
}

/* ---------- LAYOUT ---------- */
.idyo-editor .layout {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  justify-content: center;
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
}

.idyo-editor .idyo-right-col {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  flex: 1 1 auto;
  min-width: 0;
}

.idyo-editor .idyo-design-tools {
  display: flex;
  gap: 24px;
  align-items: stretch;
  min-width: 0;
}

.idyo-editor .idyo-design-tools[hidden],
.idyo-editor .idyo-checkout-step[hidden],
.idyo-editor .idyo-back-to-design[hidden],
.idyo-editor .idyo-digital-options[hidden],
.idyo-editor .idyo-download-panel[hidden],
.idyo-editor .idyo-order-focus-actions[hidden] {
  display: none !important;
}

/* Preview action bar under invitation */
.idyo-editor .idyo-invite-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 14px 0 0;
  max-width: 100%;
}

.idyo-editor .idyo-invite-btn {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 15px;
  line-height: 1.2;
  padding: 10px 16px;
  border-radius: 2px;
  cursor: pointer;
  border: 1px solid #6b4f2a;
  background: #fff;
  color: #3a2c18;
  transition: background 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.idyo-editor .idyo-invite-btn:hover {
  background: #f7f2e8;
}

.idyo-editor .idyo-invite-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.idyo-editor .idyo-invite-btn-primary {
  background: #5c3d1e;
  border-color: #5c3d1e;
  color: #fff;
}

.idyo-editor .idyo-invite-btn-primary:hover {
  background: #4a3118;
  color: #fff;
}

.idyo-editor .idyo-order-focus-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

/* Save and Order — dim page, spotlight right order panel */
.idyo-editor.idyo-order-focus {
  position: relative;
}

.idyo-editor.idyo-order-focus::before {
  content: '';
  position: fixed;
  inset: 0;
  background: rgba(35, 30, 24, 0.48);
  z-index: 80;
  pointer-events: auto;
}

.idyo-editor.idyo-order-focus .invite-col,
.idyo-editor.idyo-order-focus .customize-panel {
  opacity: 0.38;
  pointer-events: none;
  filter: grayscale(0.15);
}

.idyo-editor.idyo-order-focus .order-panel {
  position: relative;
  z-index: 90;
  background: #f7f3ea;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  outline: 1px solid #c6a55c;
  padding: 12px 10px 14px;
  border-radius: 2px;
}

.idyo-editor.idyo-order-focus .idyo-order-focus-actions {
  display: flex !important;
}

.idyo-editor[data-step="checkout"] .idyo-design-tools,
.idyo-editor.idyo-step-checkout .idyo-design-tools {
  display: none !important;
}

.idyo-editor .idyo-checkout-step {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 640px;
  width: 100%;
  background: #fff;
  border: 1px solid #e4dfd0;
  padding: 22px 22px 28px;
}

.idyo-editor .idyo-checkout-hint {
  margin: 0 0 16px;
  font-size: 14px;
  color: #5a4a1f;
  line-height: 1.45;
}

.idyo-editor .idyo-back-to-design {
  display: inline-block;
  margin-top: 16px;
  padding: 8px 0;
  border: none;
  background: none;
  color: #5a4a1f;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-digital-options[hidden] {
  display: none;
}

/* ---------- INVITATION CANVAS (PDF only — no cream/gold side frames) ---------- */
.idyo-editor .invite-col {
  width: 420px;
  max-width: 100%;
  flex-shrink: 0;
  overflow: visible;
}

.idyo-editor.idyo-mode-html .invite-col {
  width: 420px;
  max-width: min(420px, 42vw);
  flex: 0 0 auto;
  margin: 0;
  overflow: visible;
}

/* HTML designs: keep Customize + Order beside the invitation (horizontal) */
.idyo-editor.idyo-mode-html .layout {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  gap: 24px;
  max-width: 1280px;
}

.idyo-editor.idyo-mode-html .idyo-right-col {
  width: auto;
  max-width: none;
  margin: 0;
  flex: 0 1 auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
}

.idyo-editor.idyo-mode-html .idyo-design-tools {
  width: auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 24px;
}

.idyo-editor.idyo-mode-html .customize-panel,
.idyo-editor.idyo-mode-html .order-panel {
  flex: 0 0 auto;
  width: 280px;
  max-width: 280px;
}

.idyo-editor.idyo-mode-html .order-panel {
  width: 300px;
  max-width: 300px;
}

.idyo-editor .invite-wrap {
  position: relative;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  overflow: visible;
}

.idyo-editor .idyo-fabric-stage {
  position: relative;
  min-height: 160px;
  background: transparent;
  border: none;
  padding: 0;
  text-align: center;
  line-height: 0;
  overflow: visible;
}

.idyo-editor .idyo-html-stage {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0 auto;
  line-height: normal;
  text-align: center;
}

.idyo-editor .idyo-page-viewport {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow: hidden;
}

.idyo-editor .idyo-page-scaler {
  position: relative;
  flex: 0 0 auto;
  /* width/height set by JS to scaled page size */
}

.idyo-editor .idyo-page-sheet {
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.12);
  transform-origin: top left;
  overflow: hidden;
  box-sizing: border-box;
}

.idyo-editor .idyo-page-sheet .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-card {
  overflow: visible !important;
}

/* Twin Gold: keep text clipped inside the gold border when fonts/sizes change */
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok,
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok .idyo-card-inner {
  overflow: hidden !important;
}

/* Classic Navy: same — lock panel margins to PDF (edit = product = export) */
.idyo-editor .idyo-page-sheet .idyo-design-classic-navy,
.idyo-editor .idyo-page-sheet .idyo-design-classic-navy .idyo-panel {
  overflow: hidden !important;
}

/* Flow-layout BM card: border wraps content; allow auto height (no letter-page clip) */
.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal {
  height: auto !important;
  overflow: visible !important;
}

.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal .idyo-card-inner {
  height: auto !important;
  overflow: visible !important;
}

/* Absolute PDF pixel-lock designs: fill sheet height so top/bottom margins match PDF */
.idyo-editor .idyo-page-sheet .idyo-design-klein,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg,
.idyo-editor .idyo-page-sheet .idyo-design-bender,
.idyo-editor .idyo-page-sheet .idyo-design-shechter,
.idyo-editor .idyo-page-sheet .idyo-design-two-cards-color {
  height: 100% !important;
  overflow: hidden !important;
}

.idyo-editor .idyo-page-sheet .idyo-design-klein .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-bender .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-shechter .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-klein .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-bender .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-shechter .idyo-card-inner {
  height: 100% !important;
  overflow: hidden !important;
  border: none !important;
}

.idyo-editor .idyo-html-stage .idyo-design-card {
  margin: 0 auto;
}

.idyo-editor.idyo-mode-html .idyo-fabric-stage {
  line-height: normal;
  min-height: 0;
}

.idyo-editor.idyo-mode-html .invite-wrap {
  overflow: visible;
}

.idyo-editor.idyo-mode-html .idyo-fabric-stage canvas {
  display: none;
}

.idyo-editor .idyo-fabric-stage canvas {
  display: block;
  max-width: 100%;
  margin: 0 auto;
  border: none;
}

.idyo-editor .idyo-pencil-layer {
  /* Legacy overlay — pencils are intentionally hidden */
  display: none !important;
  pointer-events: none;
}

.idyo-editor .idyo-edit {
  position: relative;
  cursor: text;
  outline: none !important;
  border-radius: 3px;
  transition: box-shadow 0.18s ease, background-color 0.18s ease;
  -webkit-tap-highlight-color: transparent;
  /* Extra hit area so caret can land after the last character (esp. Hebrew/RTL). */
  padding-inline: 0.35em;
  margin-inline: -0.35em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.idyo-editor .idyo-edit[dir="rtl"],
.idyo-editor .idyo-edit[data-dyo-lang="hebrew"] {
  direction: rtl;
  unicode-bidi: isolate;
  /* Logical end of RTL text is inline-end — give room to click past the last letter. */
  padding-inline-end: 0.65em;
  margin-inline-end: -0.65em;
}

.idyo-editor .idyo-edit:hover {
  box-shadow: 0 0 0 1px rgba(184, 134, 11, 0.28);
}

.idyo-editor .idyo-edit.is-active,
.idyo-editor .idyo-edit.is-active:hover {
  box-shadow: 0 0 0 1.5px rgba(170, 134, 48, 0.65);
  background: rgba(201, 162, 39, 0.06);
}

/* Soft gold selection instead of browser blue */
.idyo-editor .idyo-edit::selection,
.idyo-editor .idyo-edit *::selection {
  background: rgba(201, 162, 39, 0.28);
  color: inherit;
}

.idyo-editor .idyo-line {
  position: relative;
}

.idyo-editor .idyo-line-pencil {
  /* Keep invitation clean — no pencil icons (click text to edit). */
  display: none !important;
  pointer-events: none;
  position: absolute;
  width: 15px;
  height: 15px;
  border: 1px solid rgba(184, 134, 11, 0.4);
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(43, 38, 32, 0.08);
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 0;
  top: 50%;
  /* Stay inside the gold frame (parent often has overflow:hidden). */
  right: 0;
  left: auto;
  transform: translateY(-50%);
  z-index: 6;
  opacity: 0;
  transition: opacity 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  font-size: 10px !important;
  line-height: 1 !important;
  color: #5c584c;
}

.idyo-editor .idyo-line:hover .idyo-line-pencil,
.idyo-editor .idyo-edit.is-active ~ .idyo-line-pencil,
.idyo-editor .idyo-line:has(.idyo-edit.is-active) .idyo-line-pencil,
.idyo-editor .idyo-line-pencil:hover,
.idyo-editor .idyo-line-pencil.is-active,
.idyo-editor .idyo-line-pencil:focus-visible {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  border-color: rgba(170, 134, 48, 0.8);
  box-shadow: 0 0 0 1px rgba(170, 134, 48, 0.28);
}

.idyo-editor .idyo-line-pencil.is-he {
  right: auto;
  left: 0;
  transform: translateY(-50%);
}

.idyo-editor .idyo-line-pencil svg {
  width: 9px;
  height: 9px;
  display: block;
  pointer-events: none;
  stroke: #6a6458;
}

.idyo-editor .idyo-line-pencil:hover svg,
.idyo-editor .idyo-line-pencil.is-active svg {
  stroke: #8a6a1e;
}

.idyo-editor.idyo-step-checkout .idyo-line-pencil,
.idyo-editor.hide-pencils .idyo-line-pencil,
.idyo-editor.idyo-deliverable-capture .idyo-line-pencil {
  display: none !important;
}

.idyo-editor .edit-line {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.idyo-editor .pencil,
.idyo-editor .pencil-btn .pencil {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  opacity: 0.75;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}

.idyo-editor .pencil-btn {
  border: none;
  background: none;
  padding: 0;
  line-height: 0;
  cursor: pointer;
}

.idyo-editor .hebrew-block {
  font-family: 'Frank Ruhl Libre', serif;
  font-size: 15px;
  line-height: 1.55;
  direction: rtl;
  color: var(--text-dark);
}

.idyo-editor .hebrew-block .edit-line {
  margin-bottom: 2px;
}

.idyo-editor .divider {
  width: 150px;
  margin: 14px auto;
  opacity: 0.8;
  display: block;
}

.idyo-editor .line-text {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
  line-height: 1.2;
  vertical-align: top;
}

.idyo-editor .line-text.name-en,
.idyo-editor .name-en.line-text {
  font-family: 'Cinzel', serif;
  font-weight: 600;
  letter-spacing: 4px;
  margin: 6px 0 2px;
}

.idyo-editor .line-text.name-he,
.idyo-editor .name-he.line-text {
  font-family: 'Frank Ruhl Libre', serif;
  direction: rtl;
  margin-bottom: 4px;
}

.idyo-editor .body-hebrew {
  font-family: 'Frank Ruhl Libre', serif;
  font-size: 14px;
  direction: rtl;
  line-height: 1.5;
  margin-bottom: 6px;
}

.idyo-editor .body-hebrew .line-text {
  font-family: inherit;
  direction: rtl;
}

.idyo-editor .body-en {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  line-height: 1.6;
  margin-bottom: 14px;
}

.idyo-editor .body-en .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .address-block {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  line-height: 1.55;
  margin-bottom: 14px;
}

.idyo-editor .address-block .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .hosts {
  font-family: 'Cinzel', serif;
  font-size: 17px;
  letter-spacing: 1px;
  margin-bottom: 14px;
}

.idyo-editor .hosts .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .rsvp {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.idyo-editor .rsvp .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .hebrew-block .line-text {
  font-family: 'Frank Ruhl Libre', serif;
  direction: rtl;
}

.idyo-editor .edit-line.is-active .line-text {
  outline: 1px dashed var(--gold);
  outline-offset: 2px;
}

.idyo-editor.hide-pencils .pencil-btn,
.idyo-editor.hide-pencils .idyo-line-pencil {
  visibility: hidden;
  pointer-events: none;
}

.idyo-editor .remove-pencil-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding-left: 28px;
  font-size: 15px;
  cursor: pointer;
}

.idyo-editor .idyo-hide-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* checkbox visuals */
.idyo-editor .checkbox {
  width: 20px;
  height: 20px;
  border: 1.5px solid #333;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #fff;
}

.idyo-editor .idyo-hide-input:checked + .checkbox::after,
.idyo-editor .idyo-check-input:checked + .checkbox::after {
  content: '';
  width: 10px;
  height: 6px;
  border-left: 2.5px solid #111;
  border-bottom: 2.5px solid #111;
  transform: rotate(-45deg) translateY(-1px);
}

.idyo-editor .sq-checkbox {
  width: 16px;
  height: 16px;
  border: 1.5px solid #333;
  flex-shrink: 0;
  background: #fff;
}

.idyo-editor .idyo-sq-input:checked + .sq-checkbox {
  background: #333;
}

/* ---------- CUSTOMIZE PANEL ---------- */
.idyo-editor .customize-panel {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor .panel-title {
  font-family: 'Cinzel', serif;
  font-size: 17px;
  letter-spacing: 0.5px;
  margin: 0 0 12px;
  color: var(--brand-pink);
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  line-height: 1.25;
}

.idyo-editor .textbox {
  background: #fff;
  border: 1px solid #d8d2c2;
  min-height: 96px;
  max-height: 180px;
  width: 100%;
  padding: 14px 16px;
  color: var(--text-dark);
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  line-height: 1.5;
  resize: vertical;
  display: block;
}

.idyo-editor .textbox::placeholder {
  color: #9b968a;
}

.idyo-editor .textbox:focus {
  outline: 2px solid var(--gold);
  border-color: var(--gold);
}

6px;
  letter-spacing: 0.6px;
  color: #2b2620;
  text-transform: uppercase;
  cursor: pointer;
  text-align: left;
}

.idyo-editor .accordion .chev {
  font-size: 11px;
  color: #8a8474;
  margin-left: auto;
}

.idyo-editor .accordion .slider-value {
  margin-left: 8px;
  font-family: 'EB Garamond', serif;
  font-size: 13px;
  letter-spacing: 0;
  color: #5a4a1f;
  font-weight: 700;
  text-transform: none;
}

.idyo-editor .accordion.is-collapsed .chev {
  transform: rotate(-90deg);
  display: inline-block;
}

.idyo-editor .acc-panel {
  background: var(--panel-header);
  border-bottom: 1px solid #ddd6c2;
  padding: 12px 16px 14px;
}

.idyo-editor .acc-panel[hidden] {
  display: none;
}

.idyo-editor .font-select {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #b8b19f;
  background: #fff;
  font-family: 'EB Garamond', serif;
  font-size: 14px;
}

.idyo-editor .idyo-font-picker-label {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #3a342c;
}

.idyo-editor .idyo-font-picker {
  position: relative;
  width: 100%;
}

.idyo-editor .idyo-font-picker-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #b8b19f;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: #2b2620;
}

.idyo-editor .idyo-font-picker-trigger-code {
  flex: 0 0 auto;
  min-width: 3.2em;
  font-size: 13px;
  font-weight: 600;
}

.idyo-editor .idyo-font-picker-trigger-sample {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.2;
}

.idyo-editor .idyo-font-picker-caret {
  flex: 0 0 auto;
  color: #6a6458;
  font-size: 12px;
}

.idyo-editor .idyo-font-picker.is-open .idyo-font-picker-caret {
  transform: rotate(180deg);
}

.idyo-editor .idyo-font-picker-list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 2px);
  z-index: 40;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid #c9c2b0;
  background: #fff;
  box-shadow: 0 8px 18px rgba(43, 38, 32, 0.12);
}

.idyo-editor .idyo-font-picker-list[hidden] {
  display: none;
}

.idyo-editor .idyo-font-picker-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #e6e0d2;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: #2b2620;
}

.idyo-editor .idyo-font-picker-option:last-child {
  border-bottom: 0;
}

.idyo-editor .idyo-font-picker-option:hover,
.idyo-editor .idyo-font-picker-option.is-active {
  background: #f7f3ea;
}

.idyo-editor .idyo-font-picker-code {
  flex: 0 0 3.4em;
  font-size: 13px;
  font-weight: 600;
  color: #3a342c;
}

.idyo-editor .idyo-font-picker-sample {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 20px;
  line-height: 1.25;
  color: #1a1714;
}

.idyo-editor .idyo-move-toggle-wrap {
  margin: 0 0 12px;
  padding: 12px 14px;
  background: #f7f3ea;
  border: 1px solid #ddd6c2;
}

.idyo-editor .idyo-move-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  margin: 0;
  font-weight: 600;
  color: #2b2620;
}

.idyo-editor .idyo-move-toggle .idyo-check-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.idyo-editor .idyo-toggle-ui {
  flex: 0 0 auto;
  width: 40px;
  height: 22px;
  border-radius: 999px;
  background: #cfc8b8;
  position: relative;
  transition: background 0.15s ease;
}

.idyo-editor .idyo-toggle-ui::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 0.15s ease;
}

.idyo-editor .idyo-move-toggle .idyo-check-input:checked + .idyo-toggle-ui {
  background: #aa8630;
}

.idyo-editor .idyo-move-toggle .idyo-check-input:checked + .idyo-toggle-ui::after {
  transform: translateX(18px);
}

.idyo-editor .idyo-move-toggle-label {
  font-size: 13px;
  line-height: 1.3;
}

.idyo-editor .idyo-move-staff-note {
  display: block;
  font-style: normal;
  font-weight: 500;
  color: #6a6458;
  font-size: 11px;
}

.idyo-editor .idyo-move-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: #6a6458;
  line-height: 1.35;
}

.idyo-editor.idyo-move-on .idyo-line,
.idyo-editor.idyo-move-on .idyo-name-row,
.idyo-editor.idyo-move-on .idyo-name-hero,
.idyo-editor.idyo-move-on .idyo-name-script,
.idyo-editor.idyo-move-on .idyo-en-stack,
.idyo-editor.idyo-move-on .idyo-en-names,
.idyo-editor.idyo-move-on .idyo-en-dates,
.idyo-editor.idyo-move-on .idyo-en-venue,
.idyo-editor.idyo-move-on .idyo-he-crest,
.idyo-editor.idyo-move-on .idyo-he-names,
.idyo-editor.idyo-move-on .idyo-he-when,
.idyo-editor.idyo-move-on .idyo-he-parents {
  cursor: grab;
  touch-action: none;
}

.idyo-editor.idyo-move-on .idyo-line.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-row.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-hero.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-script.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-stack.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-names.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-dates.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-venue.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-crest.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-names.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-when.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-parents.is-dragging {
  cursor: grabbing;
  z-index: 8;
  opacity: 0.82;
  outline: 1px dashed rgba(170, 134, 48, 0.65);
  outline-offset: 2px;
}

.idyo-editor .slider-section {
  background: var(--panel-header);
  padding: 14px 16px 18px;
  border-bottom: 1px solid #ddd6c2;
}

.idyo-editor .slider-section[hidden] {
  display: none;
}

.idyo-editor .slider-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.idyo-editor .slider-btn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid #b8b19f;
  background: #e9e4d6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: #5c584c;
  flex-shrink: 0;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.idyo-editor .slider-track-wrap {
  flex: 1;
  position: relative;
  height: 22px;
  display: flex;
  align-items: center;
}

.idyo-editor .slider-input {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.01;
  cursor: pointer;
  margin: 0;
  z-index: 2;
  /* Keep a tiny opacity so some browsers still treat the control as interactable. */
}

.idyo-editor .slider-track {
  width: 100%;
  height: 2px;
  background: #c9c3b3;
  position: relative;
}

.idyo-editor .slider-track::after {
  content: '';
  position: absolute;
  left: var(--thumb-pos, 52%);
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #cbb877;
  border: 1px solid #a8955a;
  pointer-events: none;
}

.idyo-editor .color-section {
  background: var(--panel-header);
  padding: 14px 16px 18px;
}

.idyo-editor .color-section[hidden] {
  display: none;
}

.idyo-editor .color-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 9px;
}

.idyo-editor .swatch {
  aspect-ratio: 1 / 1;
  border-radius: 4px;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
}

.idyo-editor .swatch-light {
  border: 1px solid #ccc;
}

.idyo-editor .swatch.is-active {
  border-color: #222;
  box-shadow: 0 0 0 1px #fff inset;
}

/* ---------- ORDER PANEL ---------- */
.idyo-editor .order-panel {
  width: 300px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor .order-inner {
  background: transparent;
  border: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1 1 auto;
}

.idyo-editor .idyo-order-block,
.idyo-editor .idyo-order-note-box {
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 16px 16px 18px;
}

.idyo-editor .idyo-order-inset {
  margin: 4px 0 0 2px;
  padding: 10px 12px 12px;
  border: 1px solid #e8e2d4;
  background: #faf8f3;
}

.idyo-editor .idyo-order-inset .order-note {
  margin: 0 0 8px;
}

.idyo-editor .idyo-order-inset .idyo-order-action-link {
  margin-left: 0;
}

.idyo-editor .idyo-order-note-box p {
  margin: 0 0 8px;
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  color: #2b2620;
}

.idyo-editor .idyo-order-note-box p:last-child {
  margin-bottom: 0;
}

.idyo-editor .idyo-order-note-box a {
  color: #2f5fa8;
  text-decoration: underline;
}

.idyo-editor .order-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}

.idyo-editor .order-row-spaced {
  margin-top: 26px;
}

.idyo-editor .idyo-check-input,
.idyo-editor .idyo-sq-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.idyo-editor .order-label {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  color: #2b2620;
}

.idyo-editor .order-note {
  margin: 0 0 10px 28px;
  font-size: 13px;
  color: #6a6358;
  line-height: 1.35;
}

.idyo-editor .idyo-order-action-link,
.idyo-editor .idyo-pay-download-link {
  display: block;
  margin: 6px 0 0 28px;
  font-family: 'EB Garamond', serif;
  font-size: 14px;
  line-height: 1.35;
  color: #2f5fa8;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-order-back-link {
  margin-top: 10px;
}

.idyo-editor .idyo-digital-options {
  margin: 8px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.idyo-editor .idyo-order-digital-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.idyo-editor .idyo-export-layout-wrap {
  margin: 0 0 2px;
  padding: 10px 12px;
  border: 1px solid #d8d0c4;
  background: #faf8f4;
}

.idyo-editor .idyo-export-layout-label {
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5a5248;
}

.idyo-editor .idyo-export-layout-opt {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.35;
  cursor: pointer;
}

.idyo-editor .idyo-export-layout-opt:last-child {
  margin-bottom: 0;
}

.idyo-editor .idyo-panel-toggle {
  display: flex;
  justify-content: center;
  gap: 0;
  margin: 0 0 12px;
  position: relative;
  z-index: 2;
}

.idyo-editor .idyo-panel-toggle[hidden] {
  display: none !important;
}

.idyo-editor .idyo-panel-toggle-btn {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background: transparent;
  border: 1px solid #9f792c;
  color: #9f792c;
  padding: 8px 18px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.idyo-editor .idyo-panel-toggle-btn:first-child {
  border-radius: 3px 0 0 3px;
}

.idyo-editor .idyo-panel-toggle-btn:last-child {
  border-radius: 0 3px 3px 0;
  border-left: none;
}

.idyo-editor .idyo-panel-toggle-btn.is-active,
.idyo-editor .idyo-panel-toggle-btn:hover {
  background: #9f792c;
  color: #fff;
}

.idyo-editor .idyo-order-row-plain {
  margin-bottom: 0;
}

.idyo-editor .idyo-file-row {
  margin: 0;
}

.idyo-editor .idyo-file-row-box {
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 12px 14px 14px;
}

.idyo-editor .file-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 4px;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #2b2620;
  cursor: pointer;
}

.idyo-editor .idyo-pay-download-link {
  margin-left: 28px;
}

.idyo-editor .idyo-einvite-block {
  padding-top: 14px;
  padding-bottom: 16px;
}

.idyo-editor .idyo-einvite-intro {
  margin: 0 0 12px;
  font-family: 'EB Garamond', serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  color: #2b2620;
}

.idyo-editor .idyo-einvite-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.idyo-editor .idyo-einvite-link {
  display: block;
  background: #faf8f3;
  border: 1px solid #e8e2d4;
  padding: 10px 12px;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  line-height: 1.35;
  color: #2f5fa8;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-einvite-link:hover {
  background: #f3efe6;
}

.idyo-editor .continue-link[hidden] {
  display: none !important;
}

/* Order form — visible only in printed checkout step (right column) */
.idyo-editor #idyo-order-form {
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  max-width: none;
}

.idyo-editor .idyo-order-form-section {
  max-width: none;
  margin: 0;
  padding-top: 0;
  border-top: none;
  scroll-margin-top: 80px;
}

.idyo-editor .idyo-order-form-heading {
  font-family: 'Cinzel', serif;
  font-size: 20px;
  text-align: center;
  margin-bottom: 20px;
  text-transform: uppercase;
}

/* DYO printed checkout: hide Design Selection; skip ink/monogram/design extras */
.custom-card-options-form.iof-dyo-flow #design-selection,
.iof-dyo-flow #design-selection {
  display: none !important;
}

.custom-card-options-form.iof-dyo-flow .form-section[data-step="1"],
.idyo-editor .iof-dyo-flow .form-section[data-step="2"] {
  display: none !important;
}

/* Stepped flow: quantities first → Continue → contact/payment only */
.idyo-editor .iof-dyo-flow .form-progress-indicator {
  display: none;
}

.idyo-editor .iof-dyo-flow .card-option-row.btn .next-btn,
.idyo-editor .iof-dyo-flow .card-option-row.btn .back-btn {
  display: inline-block;
}

.idyo-editor .idyo-error {
  color: #b00020;
  padding: 20px;
  text-align: center;
}

.idyo-editor .idyo-canvas-status {
  margin: 0 0 10px;
  font-size: 14px;
  color: #5a4a1f;
}

.idyo-editor .idyo-canvas-status.is-error {
  color: #b00020;
}

.idyo-editor .idyo-canvas-status.is-info {
  color: #5a4a1f;
}

.idyo-editor .idyo-edit-hint {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.4;
  color: #5c564c;
}

.idyo-editor .idyo-text-actions {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.idyo-editor .idyo-btn-primary,
.idyo-editor .idyo-btn-secondary {
  border: 1px solid #8b6914;
  background: #fffdf7;
  color: #2b2620;
  padding: 8px 14px;
  font-size: 13px;
  cursor: pointer;
  border-radius: 2px;
}

.idyo-editor .idyo-btn-primary {
  background: #8b6914;
  color: #fff;
}

.idyo-editor .invite-wrap {
  position: relative;
}

.idyo-editor .idyo-watermark-overlay {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  background-repeat: repeat;
  background-size: 280px 210px;
}

.idyo-editor .invite-wrap.idyo-no-watermark .idyo-watermark-overlay,
.idyo-editor.idyo-deliverable-capture .idyo-watermark-overlay {
  display: none;
}

.idyo-editor.idyo-deliverable-capture .idyo-page-sheet,
.idyo-editor.idyo-deliverable-capture .idyo-design-card,
.idyo-editor.idyo-deliverable-capture .idyo-panel {
  overflow: visible !important;
}

.idyo-download-panel {
  margin-top: 24px;
  padding: 22px 18px 26px;
  border: 2px solid #8b6914;
  background: #fffdf7;
  text-align: center;
}

.idyo-download-panel-title {
  margin: 0 0 8px;
  font-family: 'Cinzel', serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.idyo-download-panel-note {
  margin: 0 0 12px;
}

.idyo-download-status {
  min-height: 1.4em;
  margin: 0 0 14px;
}

.idyo-download-status.is-success {
  color: #1f6b3a;
}

.idyo-download-status.is-error {
  color: #b00020;
}

.idyo-download-status.is-info {
  color: #5a4a1f;
}

.idyo-digital-checkout {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}

.idyo-digital-intro,
.idyo-digital-locked-note {
  text-align: left;
  max-width: none;
  margin: 0 0 14px;
  line-height: 1.5;
  font-size: 14px;
}

.idyo-digital-form {
  max-width: none;
  margin: 0;
}

.idyo-digital-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
  margin-bottom: 20px;
}

.idyo-digital-fields label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.idyo-digital-fields input,
.idyo-digital-fields textarea {
  font: inherit;
  padding: 10px 12px;
  border: 1px solid #cfc7b8;
  border-radius: 2px;
}

.idyo-digital-full {
  grid-column: 1 / -1;
}

.idyo-digital-paypal {
  max-width: 360px;
  margin: 0 0 14px;
}

/* Hide printed-form test bypass when embedded in DYO (order-form plugin). */
.idyo-editor #pay-later-btn,
.idyo-editor .pay-later-btn,
#idyo-order-form #pay-later-btn,
#idyo-order-form .pay-later-btn {
  display: none !important;
}

.idyo-digital-status {
  text-align: left;
  min-height: 1.4em;
  margin-top: 8px;
}

.idyo-digital-status.is-error {
  color: #b00020;
}

.idyo-digital-status.is-success {
  color: #1f6b3a;
}

.idyo-download-btn {
  display: inline-block;
  margin: 8px 10px 0;
  padding: 12px 22px;
  background: #8b6914;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 1100px) {
  .idyo-editor .layout,
  .idyo-editor .idyo-right-col,
  .idyo-editor .idyo-design-tools,
  .idyo-editor.idyo-mode-html .layout,
  .idyo-editor.idyo-mode-html .idyo-right-col,
  .idyo-editor.idyo-mode-html .idyo-design-tools {
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
  }

  .idyo-editor .invite-col,
  .idyo-editor .customize-panel,
  .idyo-editor .order-panel,
  .idyo-editor .idyo-checkout-step,
  .idyo-editor.idyo-mode-html .invite-col,
  .idyo-editor.idyo-mode-html .customize-panel,
  .idyo-editor.idyo-mode-html .order-panel {
    width: 100%;
    max-width: 420px;
    flex: 0 1 auto;
  }

  .idyo-editor.idyo-mode-html .idyo-right-col {
    width: 100%;
    max-width: 420px;
  }

  .idyo-digital-fields {
    grid-template-columns: 1fr;
  }
}

.idyo-editor.idyo-is-dragging .idyo-edit {
  user-select: none !important;
  -webkit-user-select: none !important;
}

/* ===== UI polish: sharper type, aligned side panels, questions box ===== */
.idyo-editor .idyo-design-tools {
  align-items: stretch;
}

.idyo-editor .customize-panel,
.idyo-editor .order-panel {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  width: 300px;
  max-width: 300px;
  background: #f7f3ea;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor.idyo-mode-html .customize-panel,
.idyo-editor.idyo-mode-html .order-panel {
  width: 300px;
  max-width: 300px;
  flex: 0 0 300px;
}

.idyo-editor .order-inner {
  flex: 1 1 auto;
}

.idyo-editor .panel-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.7px;
  -webkit-text-stroke: 0.2px currentColor;
  paint-order: stroke fill;
}

.idyo-editor .idyo-edit-hint {
  font-size: 14.5px;
  line-height: 1.45;
  font-weight: 500;
  color: #3f3a32;
}

.idyo-editor .accordion {
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.55px;
}

.idyo-editor .idyo-btn-primary,
.idyo-editor .idyo-btn-secondary,
.idyo-editor .idyo-invite-btn {
  font-size: 16px;
  font-weight: 600;
}

.idyo-editor .order-row,
.idyo-editor .order-row span,
.idyo-editor .idyo-order-block label,
.idyo-editor .idyo-order-note-box,
.idyo-editor .idyo-order-note-box p {
  font-size: 15px;
  line-height: 1.45;
}

.idyo-editor .idyo-einvite-intro {
  font-size: 17px;
  line-height: 1.45;
  font-weight: 600;
  color: #2b2620;
}

.idyo-editor .idyo-einvite-link {
  font-size: 16px;
  font-weight: 600;
}

.idyo-editor .idyo-font-picker-label {
  font-size: 14px;
}

.idyo-editor .idyo-font-picker-trigger-sample,
.idyo-editor .idyo-font-picker-sample {
  font-weight: 500;
}

.idyo-editor .layout {
  align-items: stretch;
}

.idyo-editor .invite-col {
  display: flex;
  flex-direction: column;
  align-self: stretch;
}

.idyo-editor .idyo-questions-box {
  margin: 16px 0 0;
  padding: 12px 12px 14px;
  background: #ffffff;
  border: 1px solid #e0d9c8;
  text-align: left;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-height: 160px;
  gap: 10px;
  position: relative;
}

.idyo-editor .idyo-questions-input {
  width: 100%;
  flex: 1 1 auto;
  min-height: 120px;
  resize: vertical;
  border: 1px solid #d8d2c2;
  background: #ffffff;
  padding: 12px 14px;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.45;
  color: #2b2620;
  border-radius: 2px;
}

.idyo-editor .idyo-questions-input::placeholder {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #9a948a;
  opacity: 1;
}

.idyo-editor .idyo-questions-input:focus {
  outline: 1px solid #c6a55c;
  border-color: #c6a55c;
}

.idyo-editor .idyo-questions-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.idyo-editor .idyo-questions-actions {
  display: flex;
  justify-content: flex-end;
}

.idyo-editor .idyo-questions-send {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  padding: 9px 18px;
  border-radius: 2px;
  cursor: pointer;
  border: 1px solid #6b4f2a;
  background: #5c3d1e;
  color: #fff;
}

.idyo-editor .idyo-questions-send:hover {
  background: #4a3118;
}

.idyo-editor .idyo-questions-send:disabled {
  opacity: 0.65;
  cursor: wait;
}

.idyo-editor .idyo-questions-status {
  margin: 0;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.35;
  color: #3a7a45;
}

.idyo-editor .idyo-questions-status.is-error {
  color: #a33a3a;
}
.idyo-editor.idyo-order-focus .customize-panel {
  opacity: 0.38;
  pointer-events: none;
  filter: grayscale(0.15);
}

.idyo-editor.idyo-order-focus .order-panel {
  position: relative;
  z-index: 90;
  background: #f7f3ea;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  outline: 1px solid #c6a55c;
  padding: 12px 10px 14px;
  border-radius: 2px;
}

.idyo-editor.idyo-order-focus .idyo-order-focus-actions {
  display: flex !important;
}

.idyo-editor[data-step="checkout"] .idyo-design-tools,
.idyo-editor.idyo-step-checkout .idyo-design-tools {
  display: none !important;
}

.idyo-editor .idyo-checkout-step {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 640px;
  width: 100%;
  background: #fff;
  border: 1px solid #e4dfd0;
  padding: 22px 22px 28px;
}

.idyo-editor .idyo-checkout-hint {
  margin: 0 0 16px;
  font-size: 14px;
  color: #5a4a1f;
  line-height: 1.45;
}

.idyo-editor .idyo-back-to-design {
  display: inline-block;
  margin-top: 16px;
  padding: 8px 0;
  border: none;
  background: none;
  color: #5a4a1f;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-digital-options[hidden] {
  display: none;
}

/* ---------- INVITATION CANVAS (PDF only — no cream/gold side frames) ---------- */
.idyo-editor .invite-col {
  width: 420px;
  max-width: 100%;
  flex-shrink: 0;
  overflow: visible;
}

.idyo-editor.idyo-mode-html .invite-col {
  width: 420px;
  max-width: min(420px, 42vw);
  flex: 0 0 auto;
  margin: 0;
  overflow: visible;
}

/* HTML designs: keep Customize + Order beside the invitation (horizontal) */
.idyo-editor.idyo-mode-html .layout {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  gap: 24px;
  max-width: 1280px;
}

.idyo-editor.idyo-mode-html .idyo-right-col {
  width: auto;
  max-width: none;
  margin: 0;
  flex: 0 1 auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
}

.idyo-editor.idyo-mode-html .idyo-design-tools {
  width: auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 24px;
}

.idyo-editor.idyo-mode-html .customize-panel,
.idyo-editor.idyo-mode-html .order-panel {
  flex: 0 0 auto;
  width: 280px;
  max-width: 280px;
}

.idyo-editor.idyo-mode-html .order-panel {
  width: 300px;
  max-width: 300px;
}

.idyo-editor .invite-wrap {
  position: relative;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  overflow: visible;
}

.idyo-editor .idyo-fabric-stage {
  position: relative;
  min-height: 160px;
  background: transparent;
  border: none;
  padding: 0;
  text-align: center;
  line-height: 0;
  overflow: visible;
}

.idyo-editor .idyo-html-stage {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0 auto;
  line-height: normal;
  text-align: center;
}

.idyo-editor .idyo-page-viewport {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow: hidden;
}

.idyo-editor .idyo-page-scaler {
  position: relative;
  flex: 0 0 auto;
  /* width/height set by JS to scaled page size */
}

.idyo-editor .idyo-page-sheet {
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.12);
  transform-origin: top left;
  overflow: hidden;
  box-sizing: border-box;
}

.idyo-editor .idyo-page-sheet .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-card {
  overflow: visible !important;
}

/* Twin Gold: keep text clipped inside the gold border when fonts/sizes change */
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok,
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-yitzchok .idyo-card-inner {
  overflow: hidden !important;
}

/* Classic Navy: same — lock panel margins to PDF (edit = product = export) */
.idyo-editor .idyo-page-sheet .idyo-design-classic-navy,
.idyo-editor .idyo-page-sheet .idyo-design-classic-navy .idyo-panel {
  overflow: hidden !important;
}

/* Flow-layout BM card: border wraps content; allow auto height (no letter-page clip) */
.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal {
  height: auto !important;
  overflow: visible !important;
}

.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-modern-minimal .idyo-card-inner {
  height: auto !important;
  overflow: visible !important;
}

/* Absolute PDF pixel-lock designs: fill sheet height so top/bottom margins match PDF */
.idyo-editor .idyo-page-sheet .idyo-design-klein,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg,
.idyo-editor .idyo-page-sheet .idyo-design-bender,
.idyo-editor .idyo-page-sheet .idyo-design-shechter,
.idyo-editor .idyo-page-sheet .idyo-design-two-cards-color {
  height: 100% !important;
  overflow: hidden !important;
}

.idyo-editor .idyo-page-sheet .idyo-design-klein .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-bender .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-shechter .idyo-card-frame,
.idyo-editor .idyo-page-sheet .idyo-design-klein .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-steinberg .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-bender .idyo-card-inner,
.idyo-editor .idyo-page-sheet .idyo-design-shechter .idyo-card-inner {
  height: 100% !important;
  overflow: hidden !important;
  border: none !important;
}

.idyo-editor .idyo-html-stage .idyo-design-card {
  margin: 0 auto;
}

.idyo-editor.idyo-mode-html .idyo-fabric-stage {
  line-height: normal;
  min-height: 0;
}

.idyo-editor.idyo-mode-html .invite-wrap {
  overflow: visible;
}

.idyo-editor.idyo-mode-html .idyo-fabric-stage canvas {
  display: none;
}

.idyo-editor .idyo-fabric-stage canvas {
  display: block;
  max-width: 100%;
  margin: 0 auto;
  border: none;
}

.idyo-editor .idyo-pencil-layer {
  /* Legacy overlay — pencils are intentionally hidden */
  display: none !important;
  pointer-events: none;
}

.idyo-editor .idyo-edit {
  position: relative;
  cursor: text;
  outline: none !important;
  border-radius: 3px;
  transition: box-shadow 0.18s ease, background-color 0.18s ease;
  -webkit-tap-highlight-color: transparent;
  /* Extra hit area so caret can land after the last character (esp. Hebrew/RTL). */
  padding-inline: 0.35em;
  margin-inline: -0.35em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.idyo-editor .idyo-edit[dir="rtl"],
.idyo-editor .idyo-edit[data-dyo-lang="hebrew"] {
  direction: rtl;
  unicode-bidi: isolate;
  /* Logical end of RTL text is inline-end — give room to click past the last letter. */
  padding-inline-end: 0.65em;
  margin-inline-end: -0.65em;
}

.idyo-editor .idyo-edit:hover {
  box-shadow: 0 0 0 1px rgba(184, 134, 11, 0.28);
}

.idyo-editor .idyo-edit.is-active,
.idyo-editor .idyo-edit.is-active:hover {
  box-shadow: 0 0 0 1.5px rgba(170, 134, 48, 0.65);
  background: rgba(201, 162, 39, 0.06);
}

/* Soft gold selection instead of browser blue */
.idyo-editor .idyo-edit::selection,
.idyo-editor .idyo-edit *::selection {
  background: rgba(201, 162, 39, 0.28);
  color: inherit;
}

.idyo-editor .idyo-line {
  position: relative;
}

.idyo-editor .idyo-line-pencil {
  /* Keep invitation clean — no pencil icons (click text to edit). */
  display: none !important;
  pointer-events: none;
  position: absolute;
  width: 15px;
  height: 15px;
  border: 1px solid rgba(184, 134, 11, 0.4);
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  box-shadow: 0 1px 2px rgba(43, 38, 32, 0.08);
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 0;
  top: 50%;
  /* Stay inside the gold frame (parent often has overflow:hidden). */
  right: 0;
  left: auto;
  transform: translateY(-50%);
  z-index: 6;
  opacity: 0;
  transition: opacity 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  font-size: 10px !important;
  line-height: 1 !important;
  color: #5c584c;
}

.idyo-editor .idyo-line:hover .idyo-line-pencil,
.idyo-editor .idyo-edit.is-active ~ .idyo-line-pencil,
.idyo-editor .idyo-line:has(.idyo-edit.is-active) .idyo-line-pencil,
.idyo-editor .idyo-line-pencil:hover,
.idyo-editor .idyo-line-pencil.is-active,
.idyo-editor .idyo-line-pencil:focus-visible {
  opacity: 1;
  pointer-events: auto;
  background: #fff;
  border-color: rgba(170, 134, 48, 0.8);
  box-shadow: 0 0 0 1px rgba(170, 134, 48, 0.28);
}

.idyo-editor .idyo-line-pencil.is-he {
  right: auto;
  left: 0;
  transform: translateY(-50%);
}

.idyo-editor .idyo-line-pencil svg {
  width: 9px;
  height: 9px;
  display: block;
  pointer-events: none;
  stroke: #6a6458;
}

.idyo-editor .idyo-line-pencil:hover svg,
.idyo-editor .idyo-line-pencil.is-active svg {
  stroke: #8a6a1e;
}

.idyo-editor.idyo-step-checkout .idyo-line-pencil,
.idyo-editor.hide-pencils .idyo-line-pencil,
.idyo-editor.idyo-deliverable-capture .idyo-line-pencil {
  display: none !important;
}

.idyo-editor .edit-line {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.idyo-editor .pencil,
.idyo-editor .pencil-btn .pencil {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  opacity: 0.75;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}

.idyo-editor .pencil-btn {
  border: none;
  background: none;
  padding: 0;
  line-height: 0;
  cursor: pointer;
}

.idyo-editor .hebrew-block {
  font-family: 'Frank Ruhl Libre', serif;
  font-size: 15px;
  line-height: 1.55;
  direction: rtl;
  color: var(--text-dark);
}

.idyo-editor .hebrew-block .edit-line {
  margin-bottom: 2px;
}

.idyo-editor .divider {
  width: 150px;
  margin: 14px auto;
  opacity: 0.8;
  display: block;
}

.idyo-editor .line-text {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
  line-height: 1.2;
  vertical-align: top;
}

.idyo-editor .line-text.name-en,
.idyo-editor .name-en.line-text {
  font-family: 'Cinzel', serif;
  font-weight: 600;
  letter-spacing: 4px;
  margin: 6px 0 2px;
}

.idyo-editor .line-text.name-he,
.idyo-editor .name-he.line-text {
  font-family: 'Frank Ruhl Libre', serif;
  direction: rtl;
  margin-bottom: 4px;
}

.idyo-editor .body-hebrew {
  font-family: 'Frank Ruhl Libre', serif;
  font-size: 14px;
  direction: rtl;
  line-height: 1.5;
  margin-bottom: 6px;
}

.idyo-editor .body-hebrew .line-text {
  font-family: inherit;
  direction: rtl;
}

.idyo-editor .body-en {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  line-height: 1.6;
  margin-bottom: 14px;
}

.idyo-editor .body-en .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .address-block {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  line-height: 1.55;
  margin-bottom: 14px;
}

.idyo-editor .address-block .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .hosts {
  font-family: 'Cinzel', serif;
  font-size: 17px;
  letter-spacing: 1px;
  margin-bottom: 14px;
}

.idyo-editor .hosts .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .rsvp {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.idyo-editor .rsvp .line-text {
  font-family: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
}

.idyo-editor .hebrew-block .line-text {
  font-family: 'Frank Ruhl Libre', serif;
  direction: rtl;
}

.idyo-editor .edit-line.is-active .line-text {
  outline: 1px dashed var(--gold);
  outline-offset: 2px;
}

.idyo-editor.hide-pencils .pencil-btn,
.idyo-editor.hide-pencils .idyo-line-pencil {
  visibility: hidden;
  pointer-events: none;
}

.idyo-editor .remove-pencil-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding-left: 28px;
  font-size: 15px;
  cursor: pointer;
}

.idyo-editor .idyo-hide-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* checkbox visuals */
.idyo-editor .checkbox {
  width: 20px;
  height: 20px;
  border: 1.5px solid #333;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #fff;
}

.idyo-editor .idyo-hide-input:checked + .checkbox::after,
.idyo-editor .idyo-check-input:checked + .checkbox::after {
  content: '';
  width: 10px;
  height: 6px;
  border-left: 2.5px solid #111;
  border-bottom: 2.5px solid #111;
  transform: rotate(-45deg) translateY(-1px);
}

.idyo-editor .sq-checkbox {
  width: 16px;
  height: 16px;
  border: 1.5px solid #333;
  flex-shrink: 0;
  background: #fff;
}

.idyo-editor .idyo-sq-input:checked + .sq-checkbox {
  background: #333;
}

/* ---------- CUSTOMIZE PANEL ---------- */
.idyo-editor .customize-panel {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor .panel-title {
  font-family: 'Cinzel', serif;
  font-size: 17px;
  letter-spacing: 0.5px;
  margin: 0 0 12px;
  color: var(--brand-pink);
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  line-height: 1.25;
}

.idyo-editor .textbox {
  background: #fff;
  border: 1px solid #d8d2c2;
  min-height: 96px;
  max-height: 180px;
  width: 100%;
  padding: 14px 16px;
  color: var(--text-dark);
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  line-height: 1.5;
  resize: vertical;
  display: block;
}

.idyo-editor .textbox::placeholder {
  color: #9b968a;
}

.idyo-editor .textbox:focus {
  outline: 2px solid var(--gold);
  border-color: var(--gold);
}

.4px;
  color: #2b2620;
  text-transform: uppercase;
  cursor: pointer;
  text-align: left;
}

.idyo-editor .accordion .chev {
  font-size: 11px;
  color: #8a8474;
  margin-left: auto;
}

.idyo-editor .accordion .slider-value {
  margin-left: 8px;
  font-family: 'EB Garamond', serif;
  font-size: 13px;
  letter-spacing: 0;
  color: #5a4a1f;
  font-weight: 700;
  text-transform: none;
}

.idyo-editor .accordion.is-collapsed .chev {
  transform: rotate(-90deg);
  display: inline-block;
}

.idyo-editor .acc-panel {
  background: var(--panel-header);
  border-bottom: 1px solid #ddd6c2;
  padding: 12px 16px 14px;
}

.idyo-editor .acc-panel[hidden] {
  display: none;
}

.idyo-editor .font-select {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #b8b19f;
  background: #fff;
  font-family: 'EB Garamond', serif;
  font-size: 14px;
}

.idyo-editor .idyo-font-picker-label {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #3a342c;
}

.idyo-editor .idyo-font-picker {
  position: relative;
  width: 100%;
}

.idyo-editor .idyo-font-picker-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #b8b19f;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: #2b2620;
}

.idyo-editor .idyo-font-picker-trigger-code {
  flex: 0 0 auto;
  min-width: 3.2em;
  font-size: 13px;
  font-weight: 600;
}

.idyo-editor .idyo-font-picker-trigger-sample {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.2;
}

.idyo-editor .idyo-font-picker-caret {
  flex: 0 0 auto;
  color: #6a6458;
  font-size: 12px;
}

.idyo-editor .idyo-font-picker.is-open .idyo-font-picker-caret {
  transform: rotate(180deg);
}

.idyo-editor .idyo-font-picker-list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 2px);
  z-index: 40;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid #c9c2b0;
  background: #fff;
  box-shadow: 0 8px 18px rgba(43, 38, 32, 0.12);
}

.idyo-editor .idyo-font-picker-list[hidden] {
  display: none;
}

.idyo-editor .idyo-font-picker-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #e6e0d2;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: #2b2620;
}

.idyo-editor .idyo-font-picker-option:last-child {
  border-bottom: 0;
}

.idyo-editor .idyo-font-picker-option:hover,
.idyo-editor .idyo-font-picker-option.is-active {
  background: #f7f3ea;
}

.idyo-editor .idyo-font-picker-code {
  flex: 0 0 3.4em;
  font-size: 13px;
  font-weight: 600;
  color: #3a342c;
}

.idyo-editor .idyo-font-picker-sample {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 20px;
  line-height: 1.25;
  color: #1a1714;
}

.idyo-editor .idyo-move-toggle-wrap {
  margin: 0 0 12px;
  padding: 12px 14px;
  background: #f7f3ea;
  border: 1px solid #ddd6c2;
}

.idyo-editor .idyo-move-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  margin: 0;
  font-weight: 600;
  color: #2b2620;
}

.idyo-editor .idyo-move-toggle .idyo-check-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.idyo-editor .idyo-toggle-ui {
  flex: 0 0 auto;
  width: 40px;
  height: 22px;
  border-radius: 999px;
  background: #cfc8b8;
  position: relative;
  transition: background 0.15s ease;
}

.idyo-editor .idyo-toggle-ui::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 0.15s ease;
}

.idyo-editor .idyo-move-toggle .idyo-check-input:checked + .idyo-toggle-ui {
  background: #aa8630;
}

.idyo-editor .idyo-move-toggle .idyo-check-input:checked + .idyo-toggle-ui::after {
  transform: translateX(18px);
}

.idyo-editor .idyo-move-toggle-label {
  font-size: 13px;
  line-height: 1.3;
}

.idyo-editor .idyo-move-staff-note {
  display: block;
  font-style: normal;
  font-weight: 500;
  color: #6a6458;
  font-size: 11px;
}

.idyo-editor .idyo-move-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: #6a6458;
  line-height: 1.35;
}

.idyo-editor.idyo-move-on .idyo-line,
.idyo-editor.idyo-move-on .idyo-name-row,
.idyo-editor.idyo-move-on .idyo-name-hero,
.idyo-editor.idyo-move-on .idyo-name-script,
.idyo-editor.idyo-move-on .idyo-en-stack,
.idyo-editor.idyo-move-on .idyo-en-names,
.idyo-editor.idyo-move-on .idyo-en-dates,
.idyo-editor.idyo-move-on .idyo-en-venue,
.idyo-editor.idyo-move-on .idyo-he-crest,
.idyo-editor.idyo-move-on .idyo-he-names,
.idyo-editor.idyo-move-on .idyo-he-when,
.idyo-editor.idyo-move-on .idyo-he-parents {
  cursor: grab;
  touch-action: none;
}

.idyo-editor.idyo-move-on .idyo-line.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-row.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-hero.is-dragging,
.idyo-editor.idyo-move-on .idyo-name-script.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-stack.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-names.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-dates.is-dragging,
.idyo-editor.idyo-move-on .idyo-en-venue.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-crest.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-names.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-when.is-dragging,
.idyo-editor.idyo-move-on .idyo-he-parents.is-dragging {
  cursor: grabbing;
  z-index: 8;
  opacity: 0.82;
  outline: 1px dashed rgba(170, 134, 48, 0.65);
  outline-offset: 2px;
}

.idyo-editor .slider-section {
  background: var(--panel-header);
  padding: 14px 16px 18px;
  border-bottom: 1px solid #ddd6c2;
}

.idyo-editor .slider-section[hidden] {
  display: none;
}

.idyo-editor .slider-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.idyo-editor .slider-btn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid #b8b19f;
  background: #e9e4d6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: #5c584c;
  flex-shrink: 0;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.idyo-editor .slider-track-wrap {
  flex: 1;
  position: relative;
  height: 22px;
  display: flex;
  align-items: center;
}

.idyo-editor .slider-input {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.01;
  cursor: pointer;
  margin: 0;
  z-index: 2;
  /* Keep a tiny opacity so some browsers still treat the control as interactable. */
}

.idyo-editor .slider-track {
  width: 100%;
  height: 2px;
  background: #c9c3b3;
  position: relative;
}

.idyo-editor .slider-track::after {
  content: '';
  position: absolute;
  left: var(--thumb-pos, 52%);
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #cbb877;
  border: 1px solid #a8955a;
  pointer-events: none;
}

.idyo-editor .color-section {
  background: var(--panel-header);
  padding: 14px 16px 18px;
}

.idyo-editor .color-section[hidden] {
  display: none;
}

.idyo-editor .color-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 9px;
}

.idyo-editor .swatch {
  aspect-ratio: 1 / 1;
  border-radius: 4px;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
}

.idyo-editor .swatch-light {
  border: 1px solid #ccc;
}

.idyo-editor .swatch.is-active {
  border-color: #222;
  box-shadow: 0 0 0 1px #fff inset;
}

/* ---------- ORDER PANEL ---------- */
.idyo-editor .order-panel {
  width: 300px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor .order-inner {
  background: transparent;
  border: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1 1 auto;
}

.idyo-editor .idyo-order-block,
.idyo-editor .idyo-order-note-box {
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 16px 16px 18px;
}

.idyo-editor .idyo-order-inset {
  margin: 4px 0 0 2px;
  padding: 10px 12px 12px;
  border: 1px solid #e8e2d4;
  background: #faf8f3;
}

.idyo-editor .idyo-order-inset .order-note {
  margin: 0 0 8px;
}

.idyo-editor .idyo-order-inset .idyo-order-action-link {
  margin-left: 0;
}

.idyo-editor .idyo-order-note-box p {
  margin: 0 0 8px;
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  color: #2b2620;
}

.idyo-editor .idyo-order-note-box p:last-child {
  margin-bottom: 0;
}

.idyo-editor .idyo-order-note-box a {
  color: #2f5fa8;
  text-decoration: underline;
}

.idyo-editor .order-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}

.idyo-editor .order-row-spaced {
  margin-top: 26px;
}

.idyo-editor .idyo-check-input,
.idyo-editor .idyo-sq-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.idyo-editor .order-label {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  color: #2b2620;
}

.idyo-editor .order-note {
  margin: 0 0 10px 28px;
  font-size: 13px;
  color: #6a6358;
  line-height: 1.35;
}

.idyo-editor .idyo-order-action-link,
.idyo-editor .idyo-pay-download-link {
  display: block;
  margin: 6px 0 0 28px;
  font-family: 'EB Garamond', serif;
  font-size: 14px;
  line-height: 1.35;
  color: #2f5fa8;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-order-back-link {
  margin-top: 10px;
}

.idyo-editor .idyo-digital-options {
  margin: 8px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.idyo-editor .idyo-order-digital-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.idyo-editor .idyo-export-layout-wrap {
  margin: 0 0 2px;
  padding: 10px 12px;
  border: 1px solid #d8d0c4;
  background: #faf8f4;
}

.idyo-editor .idyo-export-layout-label {
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #5a5248;
}

.idyo-editor .idyo-export-layout-opt {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.35;
  cursor: pointer;
}

.idyo-editor .idyo-export-layout-opt:last-child {
  margin-bottom: 0;
}

.idyo-editor .idyo-panel-toggle {
  display: flex;
  justify-content: center;
  gap: 0;
  margin: 0 0 12px;
  position: relative;
  z-index: 2;
}

.idyo-editor .idyo-panel-toggle[hidden] {
  display: none !important;
}

.idyo-editor .idyo-panel-toggle-btn {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background: transparent;
  border: 1px solid #9f792c;
  color: #9f792c;
  padding: 8px 18px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.idyo-editor .idyo-panel-toggle-btn:first-child {
  border-radius: 3px 0 0 3px;
}

.idyo-editor .idyo-panel-toggle-btn:last-child {
  border-radius: 0 3px 3px 0;
  border-left: none;
}

.idyo-editor .idyo-panel-toggle-btn.is-active,
.idyo-editor .idyo-panel-toggle-btn:hover {
  background: #9f792c;
  color: #fff;
}

.idyo-editor .idyo-order-row-plain {
  margin-bottom: 0;
}

.idyo-editor .idyo-file-row {
  margin: 0;
}

.idyo-editor .idyo-file-row-box {
  background: #ffffff;
  border: 1px solid #e0d9c8;
  padding: 12px 14px 14px;
}

.idyo-editor .file-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 4px;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #2b2620;
  cursor: pointer;
}

.idyo-editor .idyo-pay-download-link {
  margin-left: 28px;
}

.idyo-editor .idyo-einvite-block {
  padding-top: 14px;
  padding-bottom: 16px;
}

.idyo-editor .idyo-einvite-intro {
  margin: 0 0 12px;
  font-family: 'EB Garamond', serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  color: #2b2620;
}

.idyo-editor .idyo-einvite-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.idyo-editor .idyo-einvite-link {
  display: block;
  background: #faf8f3;
  border: 1px solid #e8e2d4;
  padding: 10px 12px;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  line-height: 1.35;
  color: #2f5fa8;
  text-decoration: underline;
  cursor: pointer;
}

.idyo-editor .idyo-einvite-link:hover {
  background: #f3efe6;
}

.idyo-editor .continue-link[hidden] {
  display: none !important;
}

/* Order form — visible only in printed checkout step (right column) */
.idyo-editor #idyo-order-form {
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  max-width: none;
}

.idyo-editor .idyo-order-form-section {
  max-width: none;
  margin: 0;
  padding-top: 0;
  border-top: none;
  scroll-margin-top: 80px;
}

.idyo-editor .idyo-order-form-heading {
  font-family: 'Cinzel', serif;
  font-size: 20px;
  text-align: center;
  margin-bottom: 20px;
  text-transform: uppercase;
}

/* DYO printed checkout: hide Design Selection; skip ink/monogram/design extras */
.custom-card-options-form.iof-dyo-flow #design-selection,
.iof-dyo-flow #design-selection {
  display: none !important;
}

.custom-card-options-form.iof-dyo-flow .form-section[data-step="1"],
.idyo-editor .iof-dyo-flow .form-section[data-step="2"] {
  display: none !important;
}

/* Stepped flow: quantities first → Continue → contact/payment only */
.idyo-editor .iof-dyo-flow .form-progress-indicator {
  display: none;
}

.idyo-editor .iof-dyo-flow .card-option-row.btn .next-btn,
.idyo-editor .iof-dyo-flow .card-option-row.btn .back-btn {
  display: inline-block;
}

.idyo-editor .idyo-error {
  color: #b00020;
  padding: 20px;
  text-align: center;
}

.idyo-editor .idyo-canvas-status {
  margin: 0 0 10px;
  font-size: 14px;
  color: #5a4a1f;
}

.idyo-editor .idyo-canvas-status.is-error {
  color: #b00020;
}

.idyo-editor .idyo-canvas-status.is-info {
  color: #5a4a1f;
}

.idyo-editor .idyo-edit-hint {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.4;
  color: #5c564c;
}

.idyo-editor .idyo-text-actions {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.idyo-editor .idyo-btn-primary,
.idyo-editor .idyo-btn-secondary {
  border: 1px solid #8b6914;
  background: #fffdf7;
  color: #2b2620;
  padding: 8px 14px;
  font-size: 13px;
  cursor: pointer;
  border-radius: 2px;
}

.idyo-editor .idyo-btn-primary {
  background: #8b6914;
  color: #fff;
}

.idyo-editor .invite-wrap {
  position: relative;
}

.idyo-editor .idyo-watermark-overlay {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
  background-repeat: repeat;
  background-size: 280px 210px;
}

.idyo-editor .invite-wrap.idyo-no-watermark .idyo-watermark-overlay,
.idyo-editor.idyo-deliverable-capture .idyo-watermark-overlay {
  display: none;
}

.idyo-editor.idyo-deliverable-capture .idyo-page-sheet,
.idyo-editor.idyo-deliverable-capture .idyo-design-card,
.idyo-editor.idyo-deliverable-capture .idyo-panel {
  overflow: visible !important;
}

.idyo-download-panel {
  margin-top: 24px;
  padding: 22px 18px 26px;
  border: 2px solid #8b6914;
  background: #fffdf7;
  text-align: center;
}

.idyo-download-panel-title {
  margin: 0 0 8px;
  font-family: 'Cinzel', serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.idyo-download-panel-note {
  margin: 0 0 12px;
}

.idyo-download-status {
  min-height: 1.4em;
  margin: 0 0 14px;
}

.idyo-download-status.is-success {
  color: #1f6b3a;
}

.idyo-download-status.is-error {
  color: #b00020;
}

.idyo-download-status.is-info {
  color: #5a4a1f;
}

.idyo-digital-checkout {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}

.idyo-digital-intro,
.idyo-digital-locked-note {
  text-align: left;
  max-width: none;
  margin: 0 0 14px;
  line-height: 1.5;
  font-size: 14px;
}

.idyo-digital-form {
  max-width: none;
  margin: 0;
}

.idyo-digital-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
  margin-bottom: 20px;
}

.idyo-digital-fields label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.idyo-digital-fields input,
.idyo-digital-fields textarea {
  font: inherit;
  padding: 10px 12px;
  border: 1px solid #cfc7b8;
  border-radius: 2px;
}

.idyo-digital-full {
  grid-column: 1 / -1;
}

.idyo-digital-paypal {
  max-width: 360px;
  margin: 0 0 14px;
}

/* Hide printed-form test bypass when embedded in DYO (order-form plugin). */
.idyo-editor #pay-later-btn,
.idyo-editor .pay-later-btn,
#idyo-order-form #pay-later-btn,
#idyo-order-form .pay-later-btn {
  display: none !important;
}

.idyo-digital-status {
  text-align: left;
  min-height: 1.4em;
  margin-top: 8px;
}

.idyo-digital-status.is-error {
  color: #b00020;
}

.idyo-digital-status.is-success {
  color: #1f6b3a;
}

.idyo-download-btn {
  display: inline-block;
  margin: 8px 10px 0;
  padding: 12px 22px;
  background: #8b6914;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 1100px) {
  .idyo-editor .layout,
  .idyo-editor .idyo-right-col,
  .idyo-editor .idyo-design-tools,
  .idyo-editor.idyo-mode-html .layout,
  .idyo-editor.idyo-mode-html .idyo-right-col,
  .idyo-editor.idyo-mode-html .idyo-design-tools {
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
  }

  .idyo-editor .invite-col,
  .idyo-editor .customize-panel,
  .idyo-editor .order-panel,
  .idyo-editor .idyo-checkout-step,
  .idyo-editor.idyo-mode-html .invite-col,
  .idyo-editor.idyo-mode-html .customize-panel,
  .idyo-editor.idyo-mode-html .order-panel {
    width: 100%;
    max-width: 420px;
    flex: 0 1 auto;
  }

  .idyo-editor.idyo-mode-html .idyo-right-col {
    width: 100%;
    max-width: 420px;
  }

  .idyo-digital-fields {
    grid-template-columns: 1fr;
  }
}

.idyo-editor.idyo-is-dragging .idyo-edit {
  user-select: none !important;
  -webkit-user-select: none !important;
}

/* ===== UI polish: sharper type, aligned side panels, questions box ===== */
.idyo-editor .idyo-design-tools {
  align-items: stretch;
}

.idyo-editor .customize-panel,
.idyo-editor .order-panel {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  width: 300px;
  max-width: 300px;
  background: #f7f3ea;
  border: 1px solid #e0d9c8;
  padding: 14px 12px 16px;
}

.idyo-editor.idyo-mode-html .customize-panel,
.idyo-editor.idyo-mode-html .order-panel {
  width: 300px;
  max-width: 300px;
  flex: 0 0 300px;
}

.idyo-editor .order-inner {
  flex: 1 1 auto;
}

.idyo-editor .panel-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.7px;
  -webkit-text-stroke: 0.2px currentColor;
  paint-order: stroke fill;
}

.idyo-editor .idyo-edit-hint {
  font-size: 14.5px;
  line-height: 1.45;
  font-weight: 500;
  color: #3f3a32;
}

.idyo-editor .accordion {
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.55px;
}

.idyo-editor .idyo-btn-primary,
.idyo-editor .idyo-btn-secondary,
.idyo-editor .idyo-invite-btn {
  font-size: 16px;
  font-weight: 600;
}

.idyo-editor .order-row,
.idyo-editor .order-row span,
.idyo-editor .idyo-order-block label,
.idyo-editor .idyo-order-note-box,
.idyo-editor .idyo-order-note-box p {
  font-size: 15px;
  line-height: 1.45;
}

.idyo-editor .idyo-einvite-intro {
  font-size: 17px;
  line-height: 1.45;
  font-weight: 600;
  color: #2b2620;
}

.idyo-editor .idyo-einvite-link {
  font-size: 16px;
  font-weight: 600;
}

.idyo-editor .idyo-font-picker-label {
  font-size: 14px;
}

.idyo-editor .idyo-font-picker-trigger-sample,
.idyo-editor .idyo-font-picker-sample {
  font-weight: 500;
}

.idyo-editor .layout {
  align-items: stretch;
}

.idyo-editor .invite-col {
  display: flex;
  flex-direction: column;
  align-self: stretch;
}

.idyo-editor .idyo-questions-box {
  margin: 16px 0 0;
  padding: 22px 18px;
  background: #f7f3ea;
  border: 1px solid #e0d9c8;
  text-align: center;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 88px;
}

.idyo-editor .idyo-questions-link {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  color: #2f5fa8;
  text-decoration: underline;
  -webkit-text-stroke: 0.15px currentColor;
}

.idyo-editor .idyo-questions-link:hover {
  color: #1e3f74;
}

.idyo-editor.idyo-order-focus .customize-panel {
  /* keep equal column chrome even when dimmed */
  opacity: 0.38;
}
/* Sara UI polish: equal panels, readable type, color names, deselect, update */
.idyo-editor .idyo-edit-hint {
  font-size: 15px;
  line-height: 1.45;
  font-weight: 600;
  color: #2b2620;
}
.idyo-editor .order-label {
  font-size: 19px;
  font-weight: 600;
}
.idyo-editor .order-note {
  font-size: 15px;
  font-weight: 500;
  color: #3a342c;
}
.idyo-editor .idyo-deselect-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.15;
  min-height: 44px;
  padding: 6px 12px;
}
.idyo-editor .idyo-deselect-line {
  display: block;
  font-weight: 600;
}
.idyo-editor .idyo-update-status {
  margin: 8px 0 0;
  text-align: center;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 13px;
  color: #3a7a45;
}
.idyo-editor .idyo-update-status.is-error {
  color: #a33a3a;
}
.idyo-editor .swatch {
  position: relative;
}
.idyo-editor .swatch::after {
  content: attr(data-color-name);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  background: #2b2620;
  color: #fff;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  padding: 4px 7px;
  border-radius: 3px;
  opacity: 0;
  pointer-events: none;
  z-index: 20;
}
.idyo-editor .swatch:hover::after,
.idyo-editor .swatch:focus::after {
  opacity: 1;
}
.idyo-editor .idyo-html-stage .idyo-edit {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-stroke: 0.22px currentColor;
}
.idyo-editor .accordion {
  font-weight: 700;
}
.idyo-editor .idyo-questions-box {
  background: #ffffff;
}
@media (min-width: 1101px) {
  .idyo-editor .layout,
  .idyo-editor .idyo-right-col,
  .idyo-editor .idyo-design-tools,
  .idyo-editor.idyo-mode-html .layout,
  .idyo-editor.idyo-mode-html .idyo-right-col,
  .idyo-editor.idyo-mode-html .idyo-design-tools {
    align-items: stretch !important;
  }
  .idyo-editor .customize-panel,
  .idyo-editor .order-panel,
  .idyo-editor.idyo-mode-html .customize-panel,
  .idyo-editor.idyo-mode-html .order-panel {
    align-self: stretch !important;
  }
}

.idyo-editor .accordion.accordion-static {
  cursor: default;
  pointer-events: none;
}
.idyo-editor .accordion.accordion-static .chev {
  display: none !important;
}
.idyo-editor .idyo-digital-options .idyo-file-row-box + .idyo-file-row-box {
  border-top: none;
}
.idyo-editor .idyo-digital-options .idyo-order-note-box {
  margin: 0;
  border-top: none;
}
.idyo-editor .idyo-einvite-block {
  margin-top: 28px;
}
.idyo-editor .idyo-order-digital-wrap { display:flex !important; flex-direction:column !important; gap:0 !important; }
.idyo-editor .idyo-order-digital-wrap .idyo-digital-options { margin-bottom:0; }
.idyo-editor .idyo-order-digital-wrap .idyo-order-note-box { margin-top:0; border-top:none; }

/* Studio v2 — two-column professional DYO layout */
.idyo-editor.idyo-studio-v2 {
  --studio-ink: #2c2c2c;
  --studio-muted: #6f6a62;
  --studio-line: #e7e1d4;
  --studio-bg: #f3efe6;
  --studio-panel: #ffffff;
  --studio-head: #2f2f2f;
  --studio-shadow: 0 10px 36px rgba(40, 32, 18, 0.1);
  background: var(--studio-bg) !important;
  padding: 32px 20px 56px !important;
  font-family: ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;
  color: var(--studio-ink);
}
.idyo-editor.idyo-studio-v2 .layout,
.idyo-editor.idyo-studio-v2.idyo-mode-html .layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 36px !important;
  align-items: start !important;
  justify-content: center !important;
  max-width: 1180px !important;
  width: 100% !important;
  margin: 0 auto !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
}
.idyo-editor.idyo-studio-v2 .invite-col,
.idyo-editor.idyo-studio-v2.idyo-mode-html .invite-col {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
}
.idyo-editor.idyo-studio-v2 .invite-wrap {
  background: #fff;
  box-shadow: var(--studio-shadow);
  border-radius: 2px;
  padding: 0;
  overflow: visible;
}
.idyo-editor.idyo-studio-v2 .idyo-page-sheet { box-shadow: none !important; }
.idyo-editor.idyo-studio-v2 .idyo-right-col,
.idyo-editor.idyo-studio-v2 .idyo-design-tools,
.idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-right-col,
.idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-design-tools {
  display: block !important;
  width: 100% !important;
  max-width: 360px !important;
  flex: none !important;
  gap: 0 !important;
  min-width: 0;
}
.idyo-editor.idyo-studio-v2 .idyo-studio {
  background: var(--studio-panel);
  border: 1px solid rgba(44, 44, 44, 0.08);
  border-radius: 12px;
  box-shadow: var(--studio-shadow);
  overflow: hidden;
}
.idyo-editor.idyo-studio-v2 .idyo-studio-title {
  margin: 0;
  padding: 15px 18px;
  background: var(--studio-head);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-family: inherit;
}
.idyo-editor.idyo-studio-v2 .customize-panel,
.idyo-editor.idyo-studio-v2 .order-panel,
.idyo-editor.idyo-studio-v2.idyo-mode-html .customize-panel,
.idyo-editor.idyo-studio-v2.idyo-mode-html .order-panel {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  display: block !important;
  align-self: auto !important;
}
.idyo-editor.idyo-studio-v2 .panel-title { display: none !important; }.idyo-editor.idyo-studio-v2 .idyo-step { border-bottom: 1px solid rgba(255,255,255,0.08); background: #fff; }
.idyo-editor.idyo-studio-v2 .idyo-step-head {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px;
  margin: 0; padding: 12px 16px; background: var(--studio-head); color: #fff;
  font-size: 11px; font-weight: 650; letter-spacing: 0.1em; text-transform: uppercase; user-select: none;
}
.idyo-editor.idyo-studio-v2 .idyo-step-head::-webkit-details-marker,
.idyo-editor.idyo-studio-v2 .idyo-step-head::marker { display: none; content: ""; }
.idyo-editor.idyo-studio-v2 .idyo-step-head::after {
  content: ""; margin-left: auto; width: 7px; height: 7px;
  border-right: 1.5px solid rgba(255,255,255,0.85); border-bottom: 1.5px solid rgba(255,255,255,0.85);
  transform: rotate(45deg); transition: transform 0.15s ease;
}
.idyo-editor.idyo-studio-v2 .idyo-step[open] .idyo-step-head::after { transform: rotate(-135deg); margin-top: 4px; }
.idyo-editor.idyo-studio-v2 .idyo-step-num {
  width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.5);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; letter-spacing: 0; flex: 0 0 22px;
}
.idyo-editor.idyo-studio-v2 .idyo-step-body { padding: 14px 16px 16px; background: #fff; }
.idyo-editor.idyo-studio-v2 .idyo-edit-hint { font-family: inherit; font-size: 13px; line-height: 1.5; color: var(--studio-muted); margin: 0 0 12px; }
.idyo-editor.idyo-studio-v2 .idyo-text-actions { display: flex; gap: 8px; margin: 0 0 10px; }
.idyo-editor.idyo-studio-v2 .idyo-btn-primary,
.idyo-editor.idyo-studio-v2 .idyo-btn-secondary { font-family: inherit; font-size: 12px; border-radius: 6px; padding: 8px 10px; }
.idyo-editor.idyo-studio-v2 .textbox { font-family: inherit; font-size: 14px; border-radius: 8px; border: 1px solid var(--studio-line); min-height: 88px; }
.idyo-editor.idyo-studio-v2 .idyo-field-label,
.idyo-editor.idyo-studio-v2 .idyo-font-picker-label,
.idyo-editor.idyo-studio-v2 .accordion.accordion-static {
  display: block; margin: 12px 0 6px; padding: 0; background: none !important; border: none !important;
  color: var(--studio-ink); font-family: inherit; font-size: 11px; font-weight: 650;
  letter-spacing: 0.08em; text-transform: uppercase; pointer-events: none; cursor: default;
}
.idyo-editor.idyo-studio-v2 .idyo-field-label:first-child,
.idyo-editor.idyo-studio-v2 .idyo-font-picker-label:first-child { margin-top: 0; }
.idyo-editor.idyo-studio-v2 .acc-panel,
.idyo-editor.idyo-studio-v2 .slider-section,
.idyo-editor.idyo-studio-v2 .color-section { background: transparent !important; border: none !important; padding: 0 !important; }
.idyo-editor.idyo-studio-v2 .idyo-font-picker-trigger { border-radius: 8px; border-color: var(--studio-line); }
.idyo-editor.idyo-studio-v2 .color-grid { gap: 8px; }
.idyo-editor.idyo-studio-v2 .swatch { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12); }
.idyo-editor.idyo-studio-v2 .idyo-studio-footer { padding: 14px 16px 16px; background: #fff; }
.idyo-editor.idyo-studio-v2 .idyo-studio-save,
.idyo-editor.idyo-studio-v2 .idyo-invite-btn-primary {
  width: 100%; background: var(--studio-head) !important; color: #fff !important; border: none !important;
  border-radius: 8px !important; font-family: inherit !important; font-size: 13px !important;
  font-weight: 700 !important; letter-spacing: 0.08em; text-transform: uppercase; padding: 13px 16px !important; cursor: pointer;
}
.idyo-editor.idyo-studio-v2 .idyo-invite-actions { width: 100%; max-width: 396px; justify-content: center; gap: 8px; margin-top: 16px; }
.idyo-editor.idyo-studio-v2 .idyo-invite-btn-primary { width: auto; flex: 1 1 140px; }
.idyo-editor.idyo-studio-v2 .idyo-invite-btn-secondary {
  font-family: inherit !important; font-size: 12px !important; border-radius: 8px !important;
  border: 1px solid #d7d0c3 !important; background: #fff !important; color: var(--studio-ink) !important; padding: 10px 12px !important;
}
.idyo-editor.idyo-studio-v2 .idyo-questions-box { width: 100%; max-width: 396px; background: #fff; border: 1px solid var(--studio-line); border-radius: 10px; box-shadow: none; }
.idyo-editor.idyo-studio-v2 .idyo-questions-input { font-family: inherit; }
.idyo-editor.idyo-studio-v2 .idyo-order-note-box { margin-top: 10px; padding: 10px 12px; background: #f7f4ee; border-radius: 8px; }
.idyo-editor.idyo-studio-v2 .idyo-einvite-block { margin-top: 16px; }
.idyo-editor.idyo-studio-v2.idyo-order-focus .invite-col,
.idyo-editor.idyo-studio-v2.idyo-order-focus .customize-panel { opacity: 0.4; }
@media (max-width: 820px) {
  .idyo-editor.idyo-studio-v2 .layout,
  .idyo-editor.idyo-studio-v2.idyo-mode-html .layout { grid-template-columns: 1fr !important; justify-items: center; }
  .idyo-editor.idyo-studio-v2 .idyo-right-col,
  .idyo-editor.idyo-studio-v2 .idyo-design-tools,
  .idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-right-col,
  .idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-design-tools { max-width: 420px !important; }
}
/* Studio layout fallback — two-column focus, stacked tools (no JS required) */
.idyo-editor .layout,
.idyo-editor.idyo-mode-html .layout {
  display: grid !important;
  grid-template-columns: minmax(280px, 1fr) 340px;
  gap: 32px !important;
  align-items: start !important;
  justify-content: center !important;
  max-width: 1180px !important;
  width: 100% !important;
  margin: 0 auto !important;
}
.idyo-editor .invite-col,
.idyo-editor.idyo-mode-html .invite-col {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  justify-self: center;
}
.idyo-editor .idyo-right-col,
.idyo-editor .idyo-design-tools,
.idyo-editor.idyo-mode-html .idyo-right-col,
.idyo-editor.idyo-mode-html .idyo-design-tools {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 340px !important;
  gap: 12px !important;
}
.idyo-editor .customize-panel,
.idyo-editor .order-panel,
.idyo-editor.idyo-mode-html .customize-panel,
.idyo-editor.idyo-mode-html .order-panel {
  width: 100% !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  background: #fff !important;
  border: 1px solid rgba(44,44,44,0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 36px rgba(40, 32, 18, 0.1) !important;
  outline: none !important;
  padding: 0 16px 16px !important;
  overflow: hidden;
}
.idyo-editor .panel-title {
  background: #2f2f2f;
  color: #fff !important;
  font-family: ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em;
  padding: 14px 16px !important;
  margin: 0 -16px 14px !important;
  white-space: normal !important;
  border-radius: 0;
}
.idyo-editor .invite-wrap {
  background: #fff;
  box-shadow: 0 10px 36px rgba(40, 32, 18, 0.1);
  border-radius: 2px;
}
.idyo-editor .accordion,
.idyo-editor .accordion.accordion-static {
  background: #2f2f2f !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px;
  margin: 10px 0 8px;
  padding: 10px 12px !important;
  font-family: ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 11px;
  letter-spacing: 0.08em;
}
.idyo-editor .acc-panel,
.idyo-editor .slider-section,
.idyo-editor .color-section {
  background: transparent !important;
  border: none !important;
}
.idyo-editor .idyo-invite-btn-primary {
  background: #2f2f2f !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: ui-sans-serif, system-ui, sans-serif !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.idyo-editor .idyo-invite-btn-secondary {
  border-radius: 8px !important;
  font-family: ui-sans-serif, system-ui, sans-serif !important;
}
.idyo-editor .swatch { border-radius: 50%; }
@media (max-width: 820px) {
  .idyo-editor .layout,
  .idyo-editor.idyo-mode-html .layout {
    grid-template-columns: 1fr !important;
    justify-items: center;
  }
  .idyo-editor .idyo-right-col,
  .idyo-editor .idyo-design-tools,
  .idyo-editor.idyo-mode-html .idyo-right-col,
  .idyo-editor.idyo-mode-html .idyo-design-tools {
    max-width: 420px !important;
  }
}
.idyo-editor.idyo-mode-html .idyo-canvas-status { display: none !important; }
.idyo-editor.idyo-studio-v2 .idyo-fabric-stage { line-height: 0; }

/* hide redundant font picker labels inside studio steps */
.idyo-editor.idyo-studio-v2 .idyo-font-picker-label { display: none !important; }

/* studio order-focus overlay off */
.idyo-editor.idyo-studio-v2.idyo-order-focus::before {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-order-focus .invite-col,
.idyo-editor.idyo-studio-v2.idyo-order-focus .customize-panel {
  opacity: 1 !important;
  pointer-events: auto !important;
  filter: none !important;
}
.idyo-editor.idyo-studio-v2 .idyo-questions-box {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
}
.idyo-editor.idyo-studio-v2 .idyo-questions-input {
  flex: none !important;
  min-height: 88px !important;
  max-height: 120px !important;
  height: 100px !important;
  resize: vertical;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .layout,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .layout {
  grid-template-columns: minmax(280px, 420px) minmax(0, 1fr) !important;
  align-items: start !important;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-right-col,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-right-col {
  max-width: none !important;
  width: 100% !important;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-checkout-step,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-checkout-step {
  display: block !important;
  max-width: none !important;
  width: 100% !important;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-questions-box,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-questions-box,
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-invite-actions,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-invite-actions {
  display: none !important;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .invite-wrap,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .invite-wrap,
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-page-sheet,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-page-sheet,
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-html-stage,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-html-stage {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-back-to-design,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-back-to-design {
  display: inline-flex !important;
  margin-top: 12px;
}
#idyo-export-host,
#idyo-export-host-panel {
  left: -12000px !important;
  top: 0 !important;
}
.idyo-editor.idyo-deliverable-capture .idyo-edit.is-active,
#idyo-export-host .idyo-edit.is-active {
  box-shadow: none !important;
  background: transparent !important;
  outline: none !important;
}
/* studio hide tools on checkout */
.idyo-editor.idyo-studio-v2 .idyo-design-tools[hidden],
.idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-design-tools,
.idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-design-tools {
  display: none !important;
}
.idyo-editor.idyo-studio-v2 .idyo-checkout-step[hidden] {
  display: none !important;
}
/* studio hide tools on checkout v2 */
.idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-design-tools[hidden],
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-design-tools,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .idyo-design-tools {
  display: none !important;
}
/* checkout two-column beside preview */
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .layout,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .layout {
  display: grid !important;
  grid-template-columns: 420px minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  justify-items: stretch !important;
  align-items: start !important;
  max-width: 1180px !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .invite-col,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .invite-col {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 420px !important;
  max-width: 420px !important;
  justify-self: start !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-right-col,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .idyo-right-col {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-watermark-overlay,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .idyo-watermark-overlay,
.idyo-editor.idyo-studio-v2 .invite-wrap .idyo-watermark-overlay {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#idyo-export-host .idyo-watermark-overlay,
#idyo-export-host-panel .idyo-watermark-overlay {
  display: none !important;
}
@media (max-width: 767px) {
  .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .layout,
  .idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .layout {
    grid-template-columns: 1fr !important;
  }
  .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .invite-col,
  .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-right-col {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 420px !important;
  }
}
/* checkout panels occupy right column */
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] #idyo-printed-checkout,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout #idyo-printed-checkout,
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] #idyo-digital-checkout,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout #idyo-digital-checkout,
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] #idyo-download-panel,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout #idyo-download-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-checkout-step,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .idyo-checkout-step {
  width: 100% !important;
  max-width: none !important;
}
/* studio soft accordion */
.idyo-editor.idyo-studio-v2.idyo-studio-soft {
  --studio-ink: #2f2c28;
  --studio-muted: #6d675e;
  --studio-line: #e4ddd0;
  --studio-cream: #f3eee4;
  --studio-cream-2: #eee8db;
  --studio-gold: #8d6b2b;
  --studio-gold-hover: #7a5c22;
  font-family: "Segoe UI", system-ui, -apple-system, Helvetica, Arial, sans-serif !important;
  color: var(--studio-ink);
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .customize-panel,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .order-panel {
  display: flex !important;
  flex-direction: column;
  gap: 10px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step {
  border: none !important;
  background: transparent !important;
  margin: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 11px 14px;
  background: var(--studio-cream) !important;
  color: var(--studio-ink) !important;
  border: 1px solid rgba(47, 44, 40, 0.06);
  border-radius: 999px !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  box-shadow: 0 1px 2px rgba(47, 44, 40, 0.04);
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  background: var(--studio-cream-2) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head::after {
  content: "";
  margin-left: auto;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--studio-ink);
  border-bottom: 1.5px solid var(--studio-ink);
  transform: rotate(45deg);
  opacity: 0.55;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head::after {
  transform: rotate(-135deg);
  margin-top: 3px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #3a3834;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  position: relative;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check::before {
  content: "";
  width: 8px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
  margin-top: -2px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-num {
  width: auto !important;
  height: auto !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  flex: 0 0 auto !important;
  color: inherit;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-body {
  padding: 14px 8px 8px 12px !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-edit-hint,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-review-note,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .order-note {
  font-family: inherit !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
  color: var(--studio-muted) !important;
  margin: 0 0 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-text-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-btn-primary {
  background: var(--studio-gold) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  padding: 8px 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-btn-primary:hover {
  background: var(--studio-gold-hover) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-btn-secondary {
  background: #fff !important;
  color: var(--studio-ink) !important;
  border: 1px solid #d9d1c3 !important;
  border-radius: 6px !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  padding: 8px 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .textbox,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-trigger,
.idyo-editor.idyo-studio-v2.idyo-studio-soft select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #ddd6c8 !important;
  border-radius: 10px !important;
  background: #fff !important;
  font-family: inherit !important;
  font-size: 13px !important;
  color: var(--studio-ink) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 12px;
  overflow: visible;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .accordion.accordion-static {
  margin: 14px 0 7px !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--studio-ink) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label:first-child,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label:first-child {
  margin-top: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-section {
  margin: 0 0 8px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-btn {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  border: 1px solid #d4ccbe !important;
  background: #fff !important;
  color: var(--studio-ink) !important;
  font-size: 16px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .color-grid {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px !important;
  padding: 10px 8px;
  background: #fff;
  border: 1px solid var(--studio-line);
  border-radius: 12px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .swatch {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .file-option,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-export-layout-label {
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--studio-ink) !important;
  letter-spacing: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-file-row-box,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-note-box,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-digital-options {
  border-color: var(--studio-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
  padding: 0 !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-save {
  width: 100%;
  background: var(--studio-gold) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 13px 16px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-save:hover {
  background: var(--studio-gold-hover) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-action-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-pay-download-link {
  font-family: inherit !important;
  font-size: 13px !important;
}
/* checkout start on quantities */
.idyo-editor[data-step="checkout"] #idyo-update-status,
.idyo-editor.idyo-step-checkout #idyo-update-status {
  display: none !important;
}
.idyo-editor[data-step="checkout"] .form-section[data-step="1"],
.idyo-editor[data-step="checkout"] .form-section[data-step="2"],
.idyo-editor.idyo-step-checkout .form-section[data-step="1"],
.idyo-editor.idyo-step-checkout .form-section[data-step="2"] {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .layout,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .layout {
  grid-template-columns: minmax(280px, max-content) minmax(360px, 1fr) !important;
}
.idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .invite-col,
.idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .invite-col {
  width: auto !important;
  max-width: none !important;
}
/* two-card preview gap */
.idyo-editor .idyo-design-two-cards-color {
  background: transparent !important;
  overflow: visible !important;
}
.idyo-editor .idyo-design-two-cards-color .idyo-panels {
  gap: 20px !important;
  overflow: visible !important;
  background: transparent;
}
.idyo-editor .idyo-design-two-cards-color .idyo-panel {
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.12);
}
.idyo-editor .idyo-design-two-cards-color .idyo-panel-en,
.idyo-editor .idyo-design-two-cards-color .idyo-panel-he {
  margin: 0 !important;
}
.idyo-editor .idyo-page-sheet:has(.idyo-design-two-cards-color),
.idyo-editor .idyo-page-scaler:has(.idyo-design-two-cards-color),
.idyo-editor .idyo-page-viewport:has(.idyo-design-two-cards-color),
.idyo-editor .invite-wrap:has(.idyo-design-two-cards-color) {
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.idyo-editor.idyo-studio-v2 .invite-wrap:has(.idyo-design-two-cards-color) {
  background: transparent !important;
  box-shadow: none !important;
}
.idyo-editor.idyo-deliverable-capture .idyo-design-two-cards-color,
#idyo-export-host .idyo-design-two-cards-color {
  background: #fff !important;
}
.idyo-editor.idyo-deliverable-capture .idyo-design-two-cards-color .idyo-panels,
#idyo-export-host .idyo-design-two-cards-color .idyo-panels {
  gap: 0 !important;
}
.idyo-editor.idyo-deliverable-capture .idyo-design-two-cards-color .idyo-panel,
#idyo-export-host .idyo-design-two-cards-color .idyo-panel {
  box-shadow: none;
}
/* classic-navy preview gap */
.idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy {
  background: transparent !important;
  overflow: visible !important;
}
.idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panels {
  overflow: visible !important;
  background: transparent;
}
.idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panel {
  background: #fff;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.12);
}
.idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panel-en {
  transform: translateX(-12px);
}
.idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panel-he {
  transform: translateX(12px);
  box-shadow: inset 0 0 0 0.5px #231F20, 0 2px 14px rgba(0, 0, 0, 0.12);
}
.idyo-editor .idyo-page-sheet:has(.idyo-design-classic-navy),
.idyo-editor .idyo-page-scaler:has(.idyo-design-classic-navy),
.idyo-editor .idyo-page-viewport:has(.idyo-design-classic-navy),
.idyo-editor .invite-wrap:has(.idyo-design-classic-navy),
.idyo-editor.idyo-studio-v2 .invite-wrap:has(.idyo-design-classic-navy) {
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
#idyo-export-host .idyo-design-classic-navy,
.idyo-editor.idyo-deliverable-capture .idyo-design-classic-navy {
  background: #fff !important;
}
#idyo-export-host .idyo-design-classic-navy .idyo-panel-en,
#idyo-export-host .idyo-design-classic-navy .idyo-panel-he,
.idyo-editor.idyo-deliverable-capture .idyo-design-classic-navy .idyo-panel-en,
.idyo-editor.idyo-deliverable-capture .idyo-design-classic-navy .idyo-panel-he {
  transform: none !important;
  box-shadow: none !important;
}
/* accordion cream bars jpg3 */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  background: #f7f3ea !important;
  color: #2f2c28 !important;
  border: 1px solid rgba(47, 44, 40, 0.07) !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 12px rgba(47, 44, 40, 0.10), 0 1px 2px rgba(47, 44, 40, 0.05) !important;
  cursor: pointer !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head:hover {
  background: #f3eee4 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head::after {
  border-right-color: #2f2c28 !important;
  border-bottom-color: #2f2c28 !important;
  opacity: 0.5;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-num,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-label {
  color: #2f2c28 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check {
  background: #3a3834;
}
/* clean studio hide questions center invite */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-questions-box {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
  align-items: center !important;
  justify-items: center !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
  width: 100% !important;
  max-width: none !important;
  justify-content: center;
  align-items: center;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-deselect-btn {
  flex-direction: row;
  white-space: nowrap;
  min-height: 0;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-deselect-line:last-child {
  display: none !important;
}
/* mobile stack checkout and preview */
@media (max-width: 980px) {
  html body .idyo-editor.idyo-studio-v2 {
    padding: 16px 12px 40px !important;
    overflow-x: hidden !important;
  }
  html body .idyo-editor.idyo-studio-v2 .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2[data-step="checkout"] .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-step-checkout .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 18px !important;
    overflow: hidden !important;
    justify-items: stretch !important;
    align-items: start !important;
    place-items: start stretch !important;
  }
  html body .idyo-editor.idyo-studio-v2 .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .invite-col {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  html body .idyo-editor.idyo-studio-v2 .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html[data-step="checkout"] .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-mode-html.idyo-step-checkout .idyo-right-col {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  html body .idyo-editor.idyo-studio-v2 .invite-wrap {
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  html body .idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-checkout-hint,
  html body .idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-checkout-hint {
    display: none !important;
  }
  html body .idyo-editor.idyo-studio-v2[data-step="checkout"] .idyo-printed-checkout,
  html body .idyo-editor.idyo-studio-v2.idyo-step-checkout .idyo-printed-checkout,
  html body .idyo-editor.idyo-studio-v2[data-step="checkout"] #idyo-order-form {
    width: 100% !important;
    max-width: 100% !important;
  }
  html body .idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panel-en,
  html body .idyo-editor:not(.idyo-deliverable-capture) .idyo-design-classic-navy .idyo-panel-he {
    transform: none !important;
  }
}
/* edit text blue border + format polish */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step {
  border: none !important;
  background: transparent !important;
  margin: 0 0 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  background: #f7f4ef !important;
  color: #2f2c28 !important;
  border: 1px solid rgba(47, 44, 40, 0.08) !important;
  border-radius: 18px !important;
  box-shadow: 0 3px 12px rgba(47, 44, 40, 0.10), 0 1px 2px rgba(47, 44, 40, 0.05) !important;
  padding: 12px 16px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  border: 2px solid #3b6db3 !important;
  background: #f8f6f1 !important;
  box-shadow: 0 4px 14px rgba(47, 44, 40, 0.12), 0 1px 2px rgba(47, 44, 40, 0.05) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-body {
  margin-top: 10px;
  padding: 0 !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] > .idyo-step-body {
  display: block;
}

/* Edit Text content */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-edit-hint {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .textbox,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-edit-textarea {
  display: block;
  width: 100%;
  min-height: 92px;
  margin: 0 0 12px;
  padding: 14px 14px 18px;
  background: #fff !important;
  border: 1px solid #e5e0d6 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 10px rgba(47, 44, 40, 0.06);
  font-family: inherit !important;
  font-size: 14px !important;
  color: #6d675e !important;
  resize: vertical;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-text-actions {
  display: flex;
  gap: 10px;
  margin: 0;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-primary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-add-text {
  flex: 1 1 0;
  background: #8a6b3d !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 650 !important;
  font-size: 13px !important;
  padding: 10px 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-secondary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-delete-text {
  flex: 1 1 0;
  background: #fff !important;
  color: #2f2c28 !important;
  border: 1px solid #d9d2c5 !important;
  border-radius: 8px !important;
  font-weight: 650 !important;
  font-size: 13px !important;
  padding: 10px 12px !important;
}

/* Choose Format panel */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-panel,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-inner {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block {
  background: #eef4fb !important;
  border: 1px solid #d5e3f4 !important;
  border-radius: 14px !important;
  padding: 14px 14px 16px !important;
  margin: 0 0 14px !important;
  box-shadow: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-digital-wrap {
  margin: 0 0 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .file-option {
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  color: #2f2c28 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-note {
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: #6d675e !important;
  margin: 6px 0 10px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-file-row-box {
  background: #fff !important;
  border: 1px solid #e5e0d6 !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  margin: 10px 0 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-action-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-pay-download-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-action-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-pay-download-link {
  display: inline-block !important;
  width: auto !important;
  max-width: 100%;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #2f5fa8 !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-action-link:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-pay-download-link:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-action-link:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-pay-download-link:hover {
  color: #1f4a8a !important;
  text-decoration: none !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box {
  background: transparent !important;
  border: none !important;
  padding: 4px 0 0 !important;
  margin: 12px 0 0 !important;
  box-shadow: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box p {
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: #4a453e !important;
  margin: 0 0 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box a,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-link {
  color: #2f5fa8 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box a:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-link:hover {
  text-decoration: none !important;
  color: #1f4a8a !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-block {
  margin-top: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-intro {
  font-family: inherit !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #4a453e !important;
  margin: 0 0 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-options {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-studio-footer,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
  padding: 8px 0 0 !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-save {
  background: #2c4a7a !important;
  border-radius: 999px !important;
  letter-spacing: 0.06em;
}
/* jpg3 studio graphic layout v1 */
.idyo-editor.idyo-studio-v2.idyo-studio-soft {
  --jpg3-ink: #2a2723;
  --jpg3-muted: #7a746a;
  --jpg3-line: #e8e2d6;
  --jpg3-bg: #f4efe6;
  --jpg3-panel: #ffffff;
  --jpg3-bar: #f3efe7;
  --jpg3-bar-hover: #efe9df;
  --jpg3-shadow: 0 8px 28px rgba(42, 39, 35, 0.08);
  --jpg3-shadow-bar: 0 2px 8px rgba(42, 39, 35, 0.08), 0 1px 2px rgba(42, 39, 35, 0.04);
  --jpg3-link: #2f5fa8;
  background: var(--jpg3-bg) !important;
  padding: 40px 24px 64px !important;
  color: var(--jpg3-ink) !important;
  font-family: "Segoe UI", system-ui, -apple-system, Helvetica, Arial, sans-serif !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 380px !important;
  gap: 40px !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-wrap {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-page-sheet {
  box-shadow: var(--jpg3-shadow) !important;
  border-radius: 4px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
.idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
  width: 100% !important;
  max-width: 380px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
  background: var(--jpg3-panel) !important;
  border: 1px solid rgba(42, 39, 35, 0.06) !important;
  border-radius: 18px !important;
  box-shadow: var(--jpg3-shadow) !important;
  overflow: hidden !important;
  padding: 18px 16px 16px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
  display: none !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .customize-panel,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .order-panel {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step {
  border: none !important;
  background: transparent !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 13px 16px !important;
  background: var(--jpg3-bar) !important;
  color: var(--jpg3-ink) !important;
  border: 1px solid rgba(42, 39, 35, 0.05) !important;
  border-radius: 14px !important;
  box-shadow: var(--jpg3-shadow-bar) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head:hover {
  background: var(--jpg3-bar-hover) !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: #3a3834 !important;
  flex: 0 0 18px !important;
  position: relative !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check::after {
  content: "" !important;
  position: absolute !important;
  left: 5px !important;
  top: 3px !important;
  width: 5px !important;
  height: 9px !important;
  border-right: 1.5px solid #fff !important;
  border-bottom: 1.5px solid #fff !important;
  transform: rotate(45deg) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-num,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-label {
  color: var(--jpg3-ink) !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-num {
  width: auto !important;
  height: auto !important;
  border: none !important;
  border-radius: 0 !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head::after {
  content: "" !important;
  margin-left: auto !important;
  width: 7px !important;
  height: 7px !important;
  border-right: 1.5px solid rgba(42, 39, 35, 0.45) !important;
  border-bottom: 1.5px solid rgba(42, 39, 35, 0.45) !important;
  transform: rotate(45deg) !important;
  opacity: 1 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head::after {
  transform: rotate(-135deg) !important;
  margin-top: 4px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-body {
  margin: 8px 2px 14px !important;
  padding: 14px 14px 16px !important;
  background: #fff !important;
  border: 1px solid var(--jpg3-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .accordion.accordion-static {
  margin: 12px 0 6px !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  color: var(--jpg3-ink) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label:first-child,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label:first-child {
  margin-top: 0 !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-trigger,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .textbox,
.idyo-editor.idyo-studio-v2.idyo-studio-soft #idyo-edit-textarea {
  border: 1px solid var(--jpg3-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
  font-family: inherit !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-row {
  gap: 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-btn {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  border: 1px solid var(--jpg3-line) !important;
  background: #f7f4ee !important;
  color: var(--jpg3-ink) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .color-grid {
  gap: 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .swatch {
  width: 22px !important;
  height: 22px !important;
  border-radius: 4px !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12) !important;
}

/* Edit Text content — clean JPG3 card */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-edit-hint {
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .textbox,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-edit-textarea {
  min-height: 88px !important;
  margin: 0 0 12px !important;
  padding: 12px 14px !important;
  color: var(--jpg3-muted) !important;
  font-size: 14px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-text-actions {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-primary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-add-text {
  flex: 1 1 0 !important;
  background: #8a6b3d !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  padding: 10px 12px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-secondary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-delete-text {
  flex: 1 1 0 !important;
  background: #fff !important;
  color: var(--jpg3-ink) !important;
  border: 1px solid var(--jpg3-line) !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  padding: 10px 12px !important;
}

/* Choose Format — soft professional cards, blue text CTAs */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block {
  background: #f3f7fc !important;
  border: 1px solid #dfe8f3 !important;
  border-radius: 12px !important;
  padding: 14px !important;
  margin: 0 0 12px !important;
  box-shadow: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .file-option {
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  color: var(--jpg3-ink) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-note,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box p,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-intro {
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--jpg3-muted) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-file-row-box {
  background: #fff !important;
  border: 1px solid var(--jpg3-line) !important;
  border-radius: 10px !important;
  padding: 12px !important;
  margin: 8px 0 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-action-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-pay-download-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-link,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-note-box a {
  display: inline-block !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 6px 0 0 !important;
  color: var(--jpg3-link) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-order-action-link:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-pay-download-link:hover,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-einvite-link:hover {
  color: #1f4a8a !important;
  text-decoration: none !important;
  background: transparent !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
  padding: 8px 2px 2px !important;
  background: transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-save {
  width: 100% !important;
  background: #2f2c28 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 13px 16px !important;
  box-shadow: none !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions {
  margin-top: 14px !important;
  gap: 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-btn-secondary {
  background: #fff !important;
  border: 1px solid var(--jpg3-line) !important;
  border-radius: 8px !important;
  color: var(--jpg3-ink) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-btn-primary {
  background: #2f2c28 !important;
  border-radius: 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-questions-box {
  display: none !important;
}

@media (max-width: 980px) {
  .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 20px !important;
  }
  .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools {
    max-width: 100% !important;
  }
  .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    border-radius: 14px !important;
  }
}
/* pixel perfect accordion checks v1 */
.idyo-editor.idyo-studio-v2.idyo-studio-soft {
  --pp-ink: #2b2824;
  --pp-muted: #6f685e;
  --pp-cream: #f5f1ea;
  --pp-cream-2: #efe9df;
  --pp-line: #e6dfd2;
  --pp-check: #22201c;
  --pp-gold: #c0a66a;
  --pp-bronze: #8a6b3d;
  --pp-link: #2f5fa8;
  --pp-shadow: 0 10px 30px rgba(43, 40, 36, 0.08);
  --pp-bar-shadow: 0 3px 10px rgba(43, 40, 36, 0.10), 0 1px 2px rgba(43, 40, 36, 0.05);
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
  background: #fff !important;
  border: 1px solid rgba(43, 40, 36, 0.06) !important;
  border-radius: 22px !important;
  box-shadow: var(--pp-shadow) !important;
  padding: 18px 16px 16px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step {
  margin: 0 0 12px !important;
  background: transparent !important;
  border: none !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 48px !important;
  padding: 12px 18px !important;
  background: var(--pp-cream) !important;
  color: var(--pp-ink) !important;
  border: 1px solid rgba(43, 40, 36, 0.04) !important;
  border-radius: 999px !important;
  box-shadow: var(--pp-bar-shadow) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head:hover {
  background: var(--pp-cream-2) !important;
}

/* Circle check — perfect center SVG */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  flex: 0 0 22px !important;
  border-radius: 50% !important;
  background: var(--pp-check) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check::before,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check::after {
  content: none !important;
  display: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-check svg {
  display: block !important;
  width: 11px !important;
  height: 11px !important;
  margin: 0 !important;
  overflow: visible !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-num {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--pp-ink) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-label {
  color: var(--pp-ink) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-head::after {
  content: "" !important;
  margin-left: auto !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 1.75px solid rgba(43, 40, 36, 0.42) !important;
  border-bottom: 1.75px solid rgba(43, 40, 36, 0.42) !important;
  transform: rotate(45deg) !important;
  opacity: 1 !important;
  flex: 0 0 auto !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step[open] .idyo-step-head::after {
  transform: rotate(-135deg) !important;
  margin-top: 5px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-body {
  margin: 10px 4px 16px !important;
  padding: 16px 16px 18px !important;
  background: #fff !important;
  border: 1px solid var(--pp-line) !important;
  border-radius: 20px !important;
  box-shadow: 0 4px 16px rgba(43, 40, 36, 0.05) !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .accordion.accordion-static {
  color: var(--pp-bronze) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  margin: 14px 0 8px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-field-label:first-child,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-label:first-child {
  margin-top: 0 !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-font-picker-trigger {
  border: 1px solid var(--pp-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-btn {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  border: 1px solid var(--pp-line) !important;
  background: #fff !important;
  color: var(--pp-ink) !important;
  box-shadow: 0 1px 2px rgba(43, 40, 36, 0.06) !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-input,
.idyo-editor.idyo-studio-v2.idyo-studio-soft input[type="range"].slider-input {
  accent-color: var(--pp-gold) !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-input::-webkit-slider-thumb,
.idyo-editor.idyo-studio-v2.idyo-studio-soft input[type="range"].slider-input::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: var(--pp-gold) !important;
  border: none !important;
  box-shadow: 0 1px 3px rgba(43, 40, 36, 0.2) !important;
  cursor: pointer !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-input::-moz-range-thumb,
.idyo-editor.idyo-studio-v2.idyo-studio-soft input[type="range"].slider-input::-moz-range-thumb {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: var(--pp-gold) !important;
  border: none !important;
  cursor: pointer !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .slider-input::-webkit-slider-runnable-track,
.idyo-editor.idyo-studio-v2.idyo-studio-soft input[type="range"].slider-input::-webkit-slider-runnable-track {
  height: 3px !important;
  background: #d8d0c2 !important;
  border-radius: 999px !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .color-grid,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-color-grid {
  gap: 10px !important;
  padding: 10px !important;
  background: var(--pp-cream) !important;
  border-radius: 14px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .swatch,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-swatch {
  width: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1) !important;
  border: 2px solid transparent !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .swatch.is-active,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .swatch.selected,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-swatch.is-active,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-swatch.selected {
  border-color: var(--pp-ink) !important;
  box-shadow: inset 0 0 0 2px #fff !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .textbox,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-edit-textarea {
  border: 1px solid var(--pp-line) !important;
  border-radius: 14px !important;
  min-height: 92px !important;
  padding: 14px !important;
  color: var(--pp-muted) !important;
  box-shadow: none !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-primary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-add-text {
  background: var(--pp-bronze) !important;
  border-radius: 10px !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit .idyo-btn-secondary,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-edit #idyo-delete-text {
  border: 1px solid var(--pp-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-save {
  background: #2b2824 !important;
  border-radius: 999px !important;
}
/* attached right sidebar frame v1 — JPG3 one composition */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft {
    background: #efeae1 !important;
    padding: 28px 20px 56px !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 360px !important;
    grid-template-rows: auto !important;
    gap: 0 !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    max-width: 1180px !important;
    width: 100% !important;
    margin: 0 auto !important;
    background: #fff !important;
    border: 1px solid rgba(43, 40, 36, 0.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 40px rgba(43, 40, 36, 0.10) !important;
    overflow: hidden !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    background: #f6f2ea !important;
    padding: 36px 28px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0 !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 360px !important;
    min-width: 0 !important;
    background: #fff !important;
    border-left: 1px solid rgba(43, 40, 36, 0.08) !important;
    align-self: stretch !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    padding: 20px 16px 18px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
    display: block !important;
    background: transparent !important;
    color: #2b2824 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    padding: 0 4px 14px !important;
    margin: 0 0 4px !important;
    border: none !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-wrap,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-page-sheet {
    box-shadow: 0 8px 28px rgba(43, 40, 36, 0.10) !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions {
    margin-top: 18px !important;
  }
}

/* keep stacked on true phones */
@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    background: transparent !important;
    padding: 0 !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools {
    border-left: none !important;
    max-width: 100% !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    border-radius: 22px !important;
    box-shadow: 0 10px 30px rgba(43, 40, 36, 0.08) !important;
    border: 1px solid rgba(43, 40, 36, 0.06) !important;
  }
}
/* full height scrollable sidebar v1 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft {
    padding: 16px 16px 40px !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 400px) !important;
    grid-template-rows: minmax(85vh, auto) !important;
    gap: 0 !important;
    align-items: stretch !important;
    justify-items: stretch !important;
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    min-height: 85vh !important;
    height: 85vh !important;
    background: #fff !important;
    border: 1px solid rgba(43, 40, 36, 0.08) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 40px rgba(43, 40, 36, 0.10) !important;
    overflow: hidden !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    grid-column: 1 !important;
    grid-row: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: auto !important;
    background: #f6f2ea !important;
    padding: 28px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    border-left: 1px solid rgba(43, 40, 36, 0.08) !important;
    background: #fff !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: 1 1 auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 18px 16px 24px !important;
    background: #fff !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    background: #fff !important;
    display: block !important;
    margin: 0 0 10px !important;
    padding: 4px 4px 12px !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .customize-panel,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .order-panel {
    width: 100% !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    background: #fff !important;
    padding: 12px 0 4px !important;
    margin-top: auto !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout {
    height: auto !important;
    min-height: 0 !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    max-height: none !important;
    overflow: visible !important;
  }
}

/* editor preview zoom workspace v1 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 16px 18px 20px !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-wrap,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-fabric-stage,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-html-stage,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-page-viewport {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-page-viewport {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    overflow: visible !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-page-scaler {
    flex: 0 0 auto !important;
    margin: 0 auto !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-idyo-zoom="maximize"] .invite-col .idyo-page-viewport,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-idyo-zoom="maximize"] .invite-wrap {
    width: max-content !important;
    min-width: 100% !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 0 12px !important;
    flex: 0 0 auto !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn {
    appearance: none !important;
    border: 1px solid rgba(43, 40, 36, 0.12) !important;
    background: #fff !important;
    color: #2b2824 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    padding: 7px 12px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    line-height: 1.2 !important;
    box-shadow: 0 1px 2px rgba(43, 40, 36, 0.04) !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn:hover { background: #f7f3ec !important; }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn.is-active {
    background: #2b2824 !important;
    color: #fff !important;
    border-color: #2b2824 !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions {
    margin-top: 16px !important;
    width: 100% !important;
    max-width: 560px !important;
    align-self: center !important;
  }
}
@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-bar {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    margin: 0 0 10px !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn {
    appearance: none !important;
    border: 1px solid rgba(43, 40, 36, 0.12) !important;
    background: #fff !important;
    color: #2b2824 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    padding: 7px 12px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn.is-active {
    background: #2b2824 !important;
    color: #fff !important;
  }
}

/* checkout visible over studio v1
   Tall-sidebar rules used display:flex !important on .idyo-design-tools,
   which overrode the [hidden] attribute and pushed printed/digital checkout
   below the 85vh rail so they never appeared. */
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools[hidden],
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-design-tools,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-design-tools,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html[data-step="checkout"] .idyo-design-tools,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html.idyo-step-checkout .idyo-design-tools {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  flex: 0 0 0 !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html[data-step="checkout"] .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html.idyo-step-checkout .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 420px) !important;
    grid-template-rows: minmax(85vh, auto) !important;
    gap: 0 !important;
    height: 85vh !important;
    min-height: 85vh !important;
    max-width: none !important;
    width: 100% !important;
    overflow: hidden !important;
    align-items: stretch !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .invite-col {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html[data-step="checkout"] .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html.idyo-step-checkout .idyo-right-col {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] #idyo-printed-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout #idyo-printed-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] #idyo-digital-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout #idyo-digital-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] #idyo-download-panel:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout #idyo-download-panel:not([hidden]) {
    display: block !important;
    flex: 1 1 auto !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 18px 16px 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    background: #fff !important;
    box-sizing: border-box !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-zoom-bar,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-zoom-bar {
    display: none !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools[hidden],
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-design-tools {
    display: none !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] #idyo-printed-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout #idyo-printed-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] #idyo-digital-checkout:not([hidden]),
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout #idyo-digital-checkout:not([hidden]) {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 4px 24px !important;
  }
}

/* sticky invite toolbar zoom v1 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: relative !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-invite-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 40 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: none !important;
    align-self: stretch !important;
    margin: 12px 0 0 !important;
    padding: 10px 12px 12px !important;
    background: rgba(246, 242, 234, 0.96) !important;
    border-top: 1px solid rgba(43, 40, 36, 0.10) !important;
    box-shadow: 0 -8px 24px rgba(43, 40, 36, 0.06) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions .idyo-zoom-bar {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 4px 0 8px !important;
    width: auto !important;
    flex: 0 0 auto !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col > .idyo-zoom-bar {
    display: none !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn {
    appearance: none !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    border: 1px solid rgba(43, 40, 36, 0.14) !important;
    background: #fff !important;
    color: #2b2824 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    cursor: pointer !important;
    box-shadow: none !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-btn:hover { background: #f7f3ec !important; }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-zoom-level {
    min-width: 46px !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #2b2824 !important;
  }
}
@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 40 !important;
    background: rgba(246, 242, 234, 0.98) !important;
    border-top: 1px solid rgba(43, 40, 36, 0.10) !important;
    padding: 10px 8px 12px !important;
    margin-top: 12px !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col > .idyo-zoom-bar { display: none !important; }
}

/* sticky invite toolbar viewport fit v1
   Keep the editor frame inside the window so the sticky bottom toolbar stays on screen. */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft {
    padding: 12px 16px 20px !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .layout {
    height: calc(100vh - 160px) !important;
    min-height: 520px !important;
    max-height: calc(100vh - 160px) !important;
    grid-template-rows: minmax(0, 1fr) !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col .invite-wrap,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col .idyo-fabric-stage {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-invite-actions {
    position: relative !important;
    bottom: auto !important;
    flex: 0 0 auto !important;
    margin-top: auto !important;
    position: sticky !important;
    bottom: 0 !important;
  }
}
/* checkout hide invite toolbar v1
   Sticky-toolbar rules used display:flex !important and overrode the older
   checkout hide — keep editing chrome off during payment/checkout. */
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-invite-actions,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-invite-actions,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html[data-step="checkout"] .idyo-invite-actions,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html.idyo-step-checkout .idyo-invite-actions,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-zoom-bar,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-zoom-bar,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-line-pencil,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-line-pencil {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-edit.is-active,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-edit.is-active,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-line.is-active,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-line.is-active {
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

html body .idyo-editor.idyo-studio-v2.idyo-studio-soft[data-step="checkout"] .idyo-edit,
html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-step-checkout .idyo-edit {
  cursor: default !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  pointer-events: none !important;
}

/* Absolute dual-card: no black panel borders */
.idyo-editor .idyo-page-sheet .idyo-design-two-cards-color .idyo-panel { border: none !important; }


/* option3 format choices gold left */
.idyo-editor .idyo-step-format .order-row,
.idyo-editor .order-panel .order-row,
.idyo-editor .idyo-order-block > .order-row,
.idyo-editor .idyo-order-digital-wrap > .order-row {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: left !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.idyo-editor .idyo-step-format .order-label,
.idyo-editor .order-panel .idyo-order-block > .order-row .order-label,
.idyo-editor .order-panel .idyo-order-digital-wrap > .order-row .order-label {
  color: #8a6b3d !important;
  font-weight: 650 !important;
  text-align: left !important;
}
.idyo-editor .idyo-order-note-box {
  text-align: left !important;
}
.idyo-editor .idyo-order-note-box .idyo-note-title,
.idyo-editor .idyo-order-note-box .idyo-note-title strong {
  display: block;
  font-weight: 700 !important;
  color: #2f2c28 !important;
  margin: 0 0 8px !important;
  font-size: 15px !important;
}
.idyo-editor .idyo-order-note-box p {
  text-align: left !important;
  margin: 0 0 0 !important;
  line-height: 1.45 !important;
}

/* option3 format choices gold left v2 */
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block > .order-row,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap > .order-row.idyo-order-row-plain,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block > .order-row,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-digital-wrap > .order-row {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: left !important;
  gap: 10px !important;
}
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block > .order-row .order-label,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap > .order-row .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block .order-label,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-digital-wrap .order-label {
  color: #8a6b3d !important;
  font-weight: 650 !important;
  text-align: left !important;
}

/* option3 even left edges */
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block {
  padding-left: 0 !important;
  padding-right: 14px !important;
}
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block > .order-row,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap > .order-row {
  padding-left: 0 !important;
  margin-left: 0 !important;
  width: 100% !important;
}
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* option3 even left edges v3 */
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block {
  padding: 14px 14px 16px 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-digital-wrap,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap {
  padding: 0 !important;
  margin-left: 0 !important;
}
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-block > .order-row,
.idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-step-format .idyo-order-digital-wrap > .order-row,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-block > .order-row,
.idyo-editor.idyo-studio-v2 .order-panel .idyo-order-digital-wrap > .order-row {
  margin-left: 0 !important;
  padding-left: 0 !important;
  justify-content: flex-start !important;
}
/* no internal sidebar scroll v2 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    overflow: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    justify-content: flex-start !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: static !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
/* sticky left invite preview v3 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    overflow: visible !important;
  }

  /* Left preview stays fixed while the page/sidebar scrolls */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: sticky !important;
    top: 16px !important;
    align-self: start !important;
    height: auto !important;
    max-height: calc(100vh - 32px) !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    justify-content: flex-start !important;
    z-index: 5 !important;
  }

  /* Right sidebar grows with options — page scroll moves it, not the left */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: static !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
/* static left scrollable right v4 */
@media (min-width: 901px) {
  /* Let the editor frame size to the viewport; avoid page-level double scroll */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html {
    overflow: visible !important;
    max-height: none !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 400px) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: stretch !important;
    height: calc(100vh - 48px) !important;
    max-height: calc(100vh - 48px) !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  /* LEFT: static preview + Save and Order — does not move with sidebar scroll */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: relative !important;
    top: auto !important;
    align-self: stretch !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    justify-content: flex-start !important;
    z-index: 1 !important;
  }

  /* RIGHT: only this column scrolls when options are open */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    position: relative !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: 1 1 auto !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
/* left max-height sticky only v5 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    overflow: visible !important;
  }

  /* LEFT only — max-height + sticky so sidebar scroll does not move it */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: sticky !important;
    top: 16px !important;
    align-self: start !important;
    height: auto !important;
    max-height: calc(100vh - 32px) !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    justify-content: flex-start !important;
    z-index: 6 !important;
  }

  /* RIGHT — no max-height; page scroll moves options only */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    position: relative !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    display: block !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: static !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
/* left sticky bottom not top v6 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: sticky !important;
    top: auto !important;
    bottom: 16px !important;
    align-self: start !important;
    height: auto !important;
    max-height: calc(100vh - 32px) !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    justify-content: flex-start !important;
    z-index: 6 !important;
  }

  /* Keep Save and Order bar pinned to the bottom of the left column */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col .idyo-invite-actions,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col .idyo-invite-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 7 !important;
    background: #f6f2ea !important;
    padding-top: 8px !important;
    padding-bottom: 4px !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    max-height: none !important;
  }
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col .idyo-invite-actions {
    position: static !important;
  }
}
/* left sticky top 20vh min-height 80vh v7 */
@media (min-width: 901px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft:not(.idyo-step-checkout):not([data-step="checkout"]) .layout,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html:not(.idyo-step-checkout):not([data-step="checkout"]) .layout {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    grid-template-rows: auto !important;
    align-items: start !important;
    overflow: visible !important;
  }

  /* LEFT editor only — sticky from 20vh, min-height 80vh */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col {
    position: sticky !important;
    top: 20vh !important;
    bottom: auto !important;
    align-self: start !important;
    height: auto !important;
    min-height: 80vh !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    justify-content: flex-start !important;
    z-index: 6 !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col .idyo-invite-actions,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .invite-col .idyo-invite-actions {
    position: static !important;
    bottom: auto !important;
    background: transparent !important;
    padding-top: 0 !important;
  }

  /* RIGHT — grows with options; page scroll moves it, left stays sticky */
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-design-tools,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-right-col,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft.idyo-mode-html .idyo-design-tools {
    position: relative !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    display: block !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio {
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-title,
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .idyo-studio-footer {
    position: static !important;
  }
}

@media (max-width: 900px) {
  html body .idyo-editor.idyo-studio-v2.idyo-studio-soft .invite-col {
    position: static !important;
    top: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}