.mobile-editor-toggle {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 100000;
  border: 0;
  border-radius: 999px;
  padding: 12px 16px;
  background: #1e4d2b;
  color: #fff;
  font: 700 13px/1 'Source Sans 3', sans-serif;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.mobile-editor-panel {
  top: auto;
  bottom: 72px;
  right: 8px;
  left: auto;
  width: min(260px, calc(100vw - 16px));
  max-height: 36vh;
  z-index: 100002;
}

.mobile-editor-panel select {
  width: 100%;
  margin-top: 4px;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
}

.mobile-editor-overlay {
  position: fixed;
  inset: 0;
  z-index: 100001;
  background: #1a1410;
  display: flex;
  flex-direction: column;
}

.mobile-editor-overlay.is-hidden { display: none; }

.mobile-editor-overlay__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  padding: 10px 16px;
  background: #2a2118;
  color: #fdf7e6;
  font: 13px/1.3 'Source Sans 3', sans-serif;
}

.mobile-editor-overlay__bar span { opacity: 0.75; flex: 1; }

.mobile-editor-overlay iframe {
  flex: 1;
  width: min(390px, 100%);
  margin: 0 auto;
  border: 0;
  background: #000;
}

html.mobile-editor-on .hero-photo-editor-toggle,
html.mobile-editor-on .hero-photo-editor-panel,
html.mobile-editor-on .path-editor-toggle,
html.mobile-editor-on .path-editor-panel:not(.mobile-editor-panel),
html.mobile-editor-on .laterals-editor-toggle,
html.mobile-editor-on .slide2-art-editor-toggle,
html.mobile-editor-on .slide2-art-editor-panel,
html.mobile-editor-on .paper-tear-editor-toggle,
html.mobile-editor-on .paper-tear-editor-panel,
html.mobile-editor-on .menu-bg-editor-toggle,
html.mobile-editor-on .menu-bg-editor-panel,
html.mobile-editor-on .menu-items-editor-toggle,
html.mobile-editor-on .menu-items-editor-panel,
html.mobile-editor-on .nav-logo-editor-toggle,
html.mobile-editor-on .gingham-editor-toggle {
  display: none !important;
}

html.mobile-editor-on.mobile-editor-active .me-draggable,
body.mobile-editor-active .me-draggable {
  pointer-events: auto !important;
  cursor: grab;
  touch-action: none;
}

html.mobile-editor-on .me-active {
  outline: 2px dashed #fcba03;
  outline-offset: 3px;
}

html.mobile-editor-on .brand-deco {
  opacity: 0.9 !important;
  z-index: 6 !important;
}

html:not([data-bellori-edit='1']) .mobile-editor-toggle,
html:not([data-bellori-edit='1']) .mobile-editor-panel,
html:not([data-bellori-edit='1']) .mobile-editor-overlay {
  display: none !important;
}
