/* Kurulum Sihirbazı — Demo + Admin ortak */
.hm-sw-overlay {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: none;
  background: rgba(15, 14, 12, 0.55);
  backdrop-filter: blur(4px);
}
.hm-sw-overlay.is-open { display: flex; align-items: stretch; justify-content: center; }
.hm-sw-shell {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(280px, 1fr);
  width: min(1180px, 100%);
  max-height: 100%;
  margin: 0 auto;
  background: #faf7f2;
  color: #1c1917;
  box-shadow: 0 24px 64px rgba(0,0,0,.28);
  overflow: hidden;
}
@media (max-width: 900px) {
  .hm-sw-shell { grid-template-columns: 1fr; max-height: 100%; overflow-y: auto; }
  .hm-sw-preview-col { min-height: 42vh; }
}
.hm-sw-form-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-right: 1px solid #e7e5e4;
  background: #fffdf8;
}
.hm-sw-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .9rem 1.1rem;
  border-bottom: 1px solid #e7e5e4;
}
.hm-sw-head h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -.01em;
}
.hm-sw-close {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fff;
  width: 2rem;
  height: 2rem;
  border-radius: .45rem;
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
}
.hm-sw-steps {
  display: flex;
  gap: .25rem;
  padding: .55rem .85rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  border-bottom: 1px solid #e7e5e4;
  background: #f5f2ec;
  scrollbar-width: thin;
  scrollbar-color: #a8a29e #e7e5e4;
}
.hm-sw-step-btn {
  appearance: none;
  border: none;
  background: transparent;
  white-space: nowrap;
  font-size: .72rem;
  font-weight: 600;
  color: #78716c;
  padding: .4rem .55rem;
  border-radius: .4rem;
  cursor: pointer;
}
.hm-sw-step-btn.is-active {
  background: #1c1917;
  color: #fff;
}
.hm-sw-step-btn.is-done {
  color: #b45309;
  background: #fff7ed;
}
.hm-sw-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.1rem 1.25rem;
}
.hm-sw-pane { display: none; }
.hm-sw-pane.is-active { display: block; animation: hmSwFade .2s ease; }
@keyframes hmSwFade {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
.hm-sw-pane h3 {
  font-size: .95rem;
  font-weight: 700;
  margin: 0 0 .35rem;
}
.hm-sw-pane .hm-sw-hint {
  font-size: .82rem;
  color: #78716c;
  margin: 0 0 1rem;
  line-height: 1.45;
}
.hm-sw-field { margin-bottom: .75rem; }
.hm-sw-field label {
  display: block;
  font-size: .8rem;
  font-weight: 600;
  margin-bottom: .25rem;
}
.hm-sw-field input[type="text"],
.hm-sw-field input[type="email"],
.hm-sw-field input[type="url"],
.hm-sw-field input[type="tel"],
.hm-sw-field textarea {
  width: 100%;
  border: 1px solid #e7e5e4;
  border-radius: .45rem;
  padding: .45rem .6rem;
  font-size: .9rem;
  background: #fff;
}
.hm-sw-field input:disabled,
.hm-sw-field textarea:disabled {
  background: #f5f5f4;
  color: #57534e;
}
.hm-sw-hr {
  border: none;
  border-top: 1px solid #e7e5e4;
  margin: .75rem 0;
}
.hm-sw-colors {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}
@media (max-width: 420px) {
  .hm-sw-colors { grid-template-columns: 1fr; }
}
.hm-sw-color-row {
  display: flex;
  gap: .4rem;
  align-items: center;
}
.hm-sw-color-row input[type="color"] {
  width: 2.4rem;
  height: 2.2rem;
  padding: 0;
  border: 1px solid #e7e5e4;
  border-radius: .4rem;
  background: #fff;
}
.hm-sw-color-row input[type="text"] {
  flex: 1;
  min-width: 0;
  border: 1px solid #e7e5e4;
  border-radius: .4rem;
  padding: .4rem .5rem;
  font-size: .85rem;
}
.hm-sw-logo-box {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  margin-bottom: 1rem;
  padding: .75rem;
  background: #f5f2ec;
  border-radius: .55rem;
}
.hm-sw-color-tools {
  margin: 0 0 .85rem;
  padding: .75rem;
  border: 1px solid #e7e5e4;
  border-radius: .7rem;
  background: #fff;
}
.hm-sw-color-tools .hm-sw-logo-box {
  margin-bottom: .75rem;
  background: #f5f2ec;
}
.hm-sw-color-tools .hm-sw-palette-field {
  margin-bottom: 0;
}
.hm-sw-color-tools .hm-sw-palette-grid {
  max-height: 148px;
  margin-bottom: 0;
}
.hm-sw-logo-preview {
  width: 64px;
  height: 64px;
  border-radius: .5rem;
  background: #fff;
  border: 1px solid #e7e5e4;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.hm-sw-logo-preview img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.hm-sw-logo-ph { color: #a8a29e; font-size: 1.25rem; }
.hm-sw-logo-actions {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.hm-sw-logo-actions .hm-sw-btn { font-size: .78rem; padding: .35rem .55rem; }
.hm-sw-muted { color: #a8a29e; font-weight: 500; }
.hm-sw-palette-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  max-height: 120px;
  overflow-y: auto;
  padding: .2rem;
  margin-bottom: .75rem;
  scrollbar-width: thin;
  scrollbar-color: #78716c #e7e5e4;
}
.hm-sw-palette-swatch {
  width: 34px;
  height: 34px;
  border-radius: .45rem;
  border: 2px solid #e7e5e4;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.hm-sw-palette-swatch.is-selected,
.hm-sw-palette-swatch:hover {
  border-color: #b45309;
  box-shadow: 0 0 0 2px rgba(180, 83, 9, .25);
}
.hm-sw-zone-fx {
  margin-bottom: .85rem;
  padding: .65rem .7rem .35rem;
  background: #faf7f2;
  border: 1px solid #e7e5e4;
  border-radius: .5rem;
}
.hm-sw-zone-fx-title {
  font-size: .78rem;
  font-weight: 700;
  color: #57534e;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: .35rem;
}
.hm-sw-zone-fx .hm-sw-slider-row { margin-bottom: .55rem; }
.hm-sw-themes {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: .45rem;
  max-height: min(62vh, 560px);
  overflow-y: auto;
  padding-right: .2rem;
  scrollbar-gutter: stable;
  scrollbar-width: auto;
  scrollbar-color: #78716c #e7e5e4;
}
.hm-sw-themes::-webkit-scrollbar {
  width: 12px;
}
.hm-sw-themes::-webkit-scrollbar-track {
  background: #e7e5e4;
  border-radius: 8px;
}
.hm-sw-themes::-webkit-scrollbar-thumb {
  background: #78716c;
  border-radius: 8px;
  border: 2px solid #e7e5e4;
}
.hm-sw-themes::-webkit-scrollbar-thumb:hover {
  background: #57534e;
}
.hm-sw-theme-card {
  appearance: none;
  border: 2px solid #e7e5e4;
  border-radius: .55rem;
  background: #fff;
  padding: .55rem .35rem;
  cursor: pointer;
  text-align: center;
  font-size: .72rem;
  font-weight: 600;
  color: #44403c;
  line-height: 1.25;
}
.hm-sw-theme-card.is-selected {
  border-color: #b45309;
  background: #fff7ed;
  color: #9a3412;
}
.hm-sw-theme-card .hm-sw-theme-id {
  display: block;
  font-size: 1rem;
  font-weight: 800;
  margin-bottom: .15rem;
}
.hm-sw-slider-row { margin-bottom: .9rem; }
.hm-sw-slider-row label {
  display: flex;
  justify-content: space-between;
  font-size: .8rem;
  font-weight: 600;
  margin-bottom: .3rem;
}
.hm-sw-slider-row input[type="range"] { width: 100%; }
.hm-sw-warn {
  font-size: .78rem;
  color: #b45309;
  background: #fff7ed;
  border-left: 3px solid #b45309;
  padding: .45rem .65rem;
  margin: .5rem 0 0;
  display: none;
}
.hm-sw-warn.is-visible { display: block; }
.hm-sw-foot {
  display: flex;
  gap: .5rem;
  justify-content: space-between;
  padding: .85rem 1.1rem;
  border-top: 1px solid #e7e5e4;
  background: #fff;
}
.hm-sw-foot-right { display: flex; gap: .5rem; }
.hm-sw-btn {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fff;
  color: #1c1917;
  font-weight: 600;
  font-size: .88rem;
  padding: .55rem .95rem;
  border-radius: .45rem;
  cursor: pointer;
}
.hm-sw-btn-primary {
  background: #1c1917;
  color: #fff;
  border-color: #1c1917;
}
.hm-sw-btn-accent {
  background: #b45309;
  color: #fff;
  border-color: #b45309;
}
.hm-sw-btn:disabled { opacity: .45; cursor: not-allowed; }
.hm-sw-preview-col {
  display: flex;
  flex-direction: column;
  background: #1c1917;
  min-height: 0;
}
.hm-sw-preview-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .55rem .85rem;
  color: #a8a29e;
  font-size: .75rem;
  font-weight: 600;
}
.hm-sw-preview-frame-wrap {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .85rem;
  padding: .5rem .75rem 1.1rem;
  min-height: 0;
}
.hm-sw-preview-frame-wrap.is-dual {
  align-items: flex-end;
  justify-content: center;
  overflow-x: auto;
}
.hm-sw-device {
  position: relative;
  width: min(340px, 92%);
  height: min(680px, calc(100% - 8px));
  min-height: 520px;
}
.hm-sw-device-cap {
  display: none;
  text-align: center;
  color: #a8a29e;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}
.hm-sw-preview-frame-wrap.is-dual .hm-sw-device-cap { display: block; }
.hm-sw-preview-frame-wrap.is-dual .hm-sw-device {
  width: min(250px, 44%);
  height: min(520px, calc(100% - 28px));
  min-height: 380px;
  flex: 0 0 auto;
}
.hm-sw-preview-frame-wrap.is-dual .hm-sw-device-focus {
  display: block;
}
.hm-sw-device-focus[hidden] { display: none !important; }
.hm-sw-preview-phone-focus {
  pointer-events: none;
  user-select: none;
}
.hm-sw-preview-phone-focus iframe {
  pointer-events: none;
}
.hm-sw-focus-empty {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: 1.2rem;
  text-align: center;
  background: #1c1917;
  color: #e7e5e4;
  font-size: .78rem;
  font-weight: 650;
  line-height: 1.35;
  pointer-events: none;
}
.hm-sw-focus-empty[hidden] { display: none !important; }
.hm-sw-focus-empty .hm-sw-muted { color: #a8a29e; font-weight: 500; font-size: .7rem; }
.hm-sw-device-btn {
  position: absolute;
  background: #2a2a2a;
  border-radius: 2px;
  z-index: 2;
}
.hm-sw-device-btn-silent {
  left: -3px; top: 96px; width: 3px; height: 22px; border-radius: 2px 0 0 2px;
}
.hm-sw-device-btn-vol-up {
  left: -3px; top: 138px; width: 3px; height: 42px; border-radius: 2px 0 0 2px;
}
.hm-sw-device-btn-vol-down {
  left: -3px; top: 188px; width: 3px; height: 42px; border-radius: 2px 0 0 2px;
}
.hm-sw-device-btn-power {
  right: -3px; top: 160px; width: 3px; height: 64px; border-radius: 0 2px 2px 0;
}
.hm-sw-preview-phone {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 2.2rem;
  overflow: hidden;
  border: 10px solid #111;
  box-shadow:
    0 0 0 1px #3f3f46,
    0 18px 50px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,255,255,.06);
  background: #000;
}
.hm-sw-notch {
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 92px;
  height: 22px;
  background: #111;
  border-radius: 999px;
  z-index: 5;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px #27272a;
}
.hm-sw-notch::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1e293b;
  box-shadow: inset 0 0 0 1px #334155;
}
.hm-sw-home-ind {
  position: absolute;
  left: 50%;
  bottom: 7px;
  transform: translateX(-50%);
  width: 108px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.35);
  z-index: 5;
  pointer-events: none;
}
.hm-sw-zone-hint {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 18px;
  z-index: 6;
  pointer-events: none;
  text-align: center;
  padding: .45rem .65rem;
  border-radius: .65rem;
  background: rgba(28, 25, 23, .88);
  color: #fff;
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .01em;
  line-height: 1.25;
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.hm-sw-zone-hint[hidden] { display: none !important; }
.hm-sw-zone-hint strong { color: #fbbf24; font-weight: 700; }
.hm-sw-preview-phone iframe {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
  display: block;
}
.hm-sw-media-types {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .45rem;
}
.hm-sw-media-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  padding: .7rem .4rem;
  border: 2px solid #e7e5e4;
  border-radius: .65rem;
  background: #fff;
  cursor: pointer;
  font-size: .78rem;
  font-weight: 700;
  color: #57534e;
  text-align: center;
}
.hm-sw-media-card input { position: absolute; opacity: 0; pointer-events: none; }
.hm-sw-media-card.is-selected {
  border-color: #b45309;
  background: #fff7ed;
  color: #9a3412;
}
.hm-sw-file-row {
  display: flex;
  gap: .4rem;
  align-items: stretch;
}
.hm-sw-file-path {
  flex: 1;
  min-width: 0;
  border: 1px solid #e7e5e4;
  border-radius: .45rem;
  padding: .45rem .6rem;
  font-size: .82rem;
  background: #f5f5f4;
  color: #44403c;
}
.hm-sw-file-row .hm-sw-btn {
  flex-shrink: 0;
  white-space: nowrap;
}
.hm-sw-upload-status {
  margin: .35rem 0 0;
  min-height: 1.1em;
}
.hm-sw-upload-status.is-ok { color: #15803d; }
.hm-sw-upload-status.is-err { color: #b91c1c; }
.hm-sw-upload-status.is-busy { color: #b45309; }
.hm-sw-summary {
  font-size: .88rem;
  line-height: 1.55;
  background: #f5f2ec;
  border-radius: .55rem;
  padding: .85rem 1rem;
}
.hm-sw-summary dt { font-weight: 700; color: #57534e; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; margin-top: .55rem; }
.hm-sw-summary dt:first-child { margin-top: 0; }
.hm-sw-summary dd { margin: .1rem 0 0; }
.hm-sw-select {
  width: 100%;
  border: 1px solid #e7e5e4;
  border-radius: .45rem;
  padding: .45rem .6rem;
  font-size: .9rem;
  background: #fff;
}
.hm-sw-check {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .88rem;
  font-weight: 600;
  margin: .35rem 0;
  cursor: pointer;
}
.hm-sw-wh-row {
  display: grid;
  grid-template-columns: 4.5rem 1fr 1fr;
  gap: .4rem;
  align-items: center;
  margin-bottom: .4rem;
}
.hm-sw-wh-row input[type="time"] {
  border: 1px solid #e7e5e4;
  border-radius: .4rem;
  padding: .3rem .4rem;
  font-size: .85rem;
}
.hm-sw-status { font-size: .8rem; color: #78716c; min-height: 1.2em; }
.hm-sw-status.is-ok { color: #15803d; }
.hm-sw-status.is-err { color: #b91c1c; }

/* Bölge inspector (tıklayarak renk / opaklık / blur) */
.hm-sw-zone-tabs {
  display: flex;
  gap: .35rem;
  margin: .5rem 0 .75rem;
}
.hm-sw-zone-tab {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fff;
  font-size: .78rem;
  font-weight: 700;
  padding: .4rem .7rem;
  border-radius: .45rem;
  cursor: pointer;
  color: #57534e;
}
.hm-sw-zone-tab.is-active {
  background: #1c1917;
  border-color: #1c1917;
  color: #fff;
}
.hm-sw-zone-tab:focus { outline: none; }
.hm-sw-zone-tab:focus-visible {
  outline: 2px solid #b45309;
  outline-offset: 2px;
}
.hm-sw-overlay:has(.hm-sw-preview-frame-wrap.is-dual) .hm-sw-shell {
  width: min(1320px, 100%);
  grid-template-columns: minmax(260px, 400px) minmax(560px, 1fr);
}
/* Basit iskelet: menü sırası (üst → kategori → içerik → alt) */
.hm-sw-skel {
  display: none;
  flex-direction: column;
  gap: 3px;
  margin: 0 0 .75rem;
  padding: 6px;
  border: 1px dashed #d6d3d1;
  border-radius: .65rem;
  background: #fafaf9;
}
.hm-sw-skel.is-visible { display: flex; }
.hm-sw-skel-part {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fff;
  color: #57534e;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  padding: .35rem .5rem;
  border-radius: .35rem;
  cursor: pointer;
  text-align: center;
  line-height: 1.2;
}
.hm-sw-skel-mid { min-height: 2.4rem; padding-top: .7rem; }
.hm-sw-skel-part.is-active {
  background: #1c1917;
  border-color: #1c1917;
  color: #fff;
}
.hm-sw-skel-part:hover { border-color: #a8a29e; }
.hm-sw-inspector {
  border: 1px solid #e7e5e4;
  border-radius: .65rem;
  background: #fff;
  padding: .75rem .85rem;
  margin-bottom: .75rem;
  min-height: 4.5rem;
}
.hm-sw-inspector-empty {
  font-size: .84rem;
  color: #78716c;
  text-align: center;
  line-height: 1.45;
  padding: .5rem 0;
}
.hm-sw-inspector-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hm-sw-inspector-head strong { font-size: .92rem; }
.hm-sw-btn-xs {
  font-size: .72rem;
  padding: .25rem .5rem;
}
.hm-sw-zone-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin-bottom: .85rem;
}
.hm-sw-chip {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fafaf9;
  font-size: .72rem;
  font-weight: 650;
  padding: .28rem .55rem;
  border-radius: 999px;
  cursor: pointer;
  color: #44403c;
}
.hm-sw-chip.is-active {
  background: #f59e0b;
  border-color: #d97706;
  color: #1c1917;
}
.hm-sw-download-row {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .75rem 0;
}
.hm-sw-download-row .hm-sw-btn {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}
.hm-sw-affects {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: .45rem;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  font-size: .78rem;
  color: #9a3412;
  line-height: 1.35;
}
.hm-sw-affects-label {
  font-weight: 700;
  margin-right: .2rem;
}
.hm-sw-affects-mini {
  margin: .15rem 0 .35rem;
  font-size: .72rem;
  color: #78716c;
  line-height: 1.3;
}
.hm-sw-grad-dirs {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}
.hm-sw-advanced {
  border-top: 1px solid #e7e5e4;
  padding-top: .65rem;
  margin-top: .35rem;
}
.hm-sw-advanced > summary {
  cursor: pointer;
  font-size: .82rem;
  font-weight: 700;
  color: #57534e;
  margin-bottom: .55rem;
}

/* Slider fotoğraf yöneticisi */
.hm-sw-slides-list {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  margin: .35rem 0 .75rem;
}
.hm-sw-slide-card {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: .55rem;
  align-items: center;
  padding: .55rem .65rem;
  border: 1px solid #e7e5e4;
  border-radius: .65rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(28, 25, 23, .04);
}
.hm-sw-slide-num {
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  background: #1c1917;
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.hm-sw-slide-thumb {
  width: 88px;
  height: 56px;
  border-radius: .45rem;
  object-fit: cover;
  background: #e7e5e4;
  display: block;
}
.hm-sw-slide-meta {
  min-width: 0;
}
.hm-sw-slide-meta strong {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  color: #1c1917;
}
.hm-sw-slide-meta span {
  font-size: .72rem;
  color: #78716c;
}
.hm-sw-slide-actions {
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.hm-sw-slide-actions button {
  appearance: none;
  border: 1px solid #e7e5e4;
  background: #fafaf9;
  width: 2rem;
  height: 1.85rem;
  border-radius: .4rem;
  cursor: pointer;
  color: #44403c;
  font-size: .78rem;
  line-height: 1;
  padding: 0;
}
.hm-sw-slide-actions button:hover:not(:disabled) {
  background: #f5f5f4;
  border-color: #d6d3d1;
}
.hm-sw-slide-actions button:disabled {
  opacity: .35;
  cursor: default;
}
.hm-sw-slide-actions button.is-danger {
  color: #b91c1c;
  border-color: #fecaca;
  background: #fef2f2;
}
.hm-sw-slides-empty {
  padding: .85rem .9rem;
  border: 1px dashed #d6d3d1;
  border-radius: .65rem;
  background: #fafaf9;
  color: #78716c;
  font-size: .84rem;
  line-height: 1.45;
  margin-bottom: .75rem;
}
.hm-sw-slides-add {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
}
.hm-sw-slides-add .hm-sw-btn-primary i {
  margin-right: .35rem;
}

.hm-sw-check.is-disabled {
  opacity: .45;
  cursor: not-allowed;
}
.hm-sw-icon-toggles {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  margin: .35rem 0 .55rem;
}
.hm-sw-actions-align {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .25rem 0 .55rem;
}
.hm-sw-actions-align .hm-sw-chip {
  cursor: pointer;
  border: 1px solid #d6d3d1;
  background: #fff;
  color: #44403c;
  font-size: .75rem;
  padding: .28rem .55rem;
  border-radius: .55rem;
  line-height: 1.2;
}
.hm-sw-actions-align .hm-sw-chip:hover {
  border-color: #f59e0b;
  color: #92400e;
  background: #fffbeb;
}
.hm-sw-actions-pad {
  position: relative;
  width: 100%;
  max-width: 168px;
  aspect-ratio: 9 / 19.5;
  margin: .4rem 0 .75rem;
  border-radius: 1.1rem;
  border: 2px solid #d6d3d1;
  background:
    linear-gradient(180deg, rgba(28,25,23,.08), rgba(28,25,23,.22)),
    repeating-linear-gradient(0deg, transparent, transparent 11px, rgba(255,255,255,.12) 11px, rgba(255,255,255,.12) 12px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
  touch-action: none;
  user-select: none;
  overflow: hidden;
  --hm-sw-pad-phone-w: 390;
  --hm-sw-grid-step: 5%;
}
.hm-sw-actions-grid {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(
      to right,
      rgba(255,255,255,.08) 0,
      rgba(255,255,255,.08) 1px,
      transparent 1px,
      transparent var(--hm-sw-grid-step)
    ),
    repeating-linear-gradient(
      to bottom,
      rgba(255,255,255,.08) 0,
      rgba(255,255,255,.08) 1px,
      transparent 1px,
      transparent var(--hm-sw-grid-step)
    );
  opacity: .85;
}
.hm-sw-actions-pad.is-dragging .hm-sw-actions-grid {
  background-image:
    repeating-linear-gradient(
      to right,
      rgba(56,189,248,.45) 0,
      rgba(56,189,248,.45) 1px,
      transparent 1px,
      transparent var(--hm-sw-grid-step)
    ),
    repeating-linear-gradient(
      to bottom,
      rgba(56,189,248,.45) 0,
      rgba(56,189,248,.45) 1px,
      transparent 1px,
      transparent var(--hm-sw-grid-step)
    );
  opacity: 1;
}
.hm-sw-actions-pad-hint {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 10px;
  font-size: .68rem;
  color: rgba(255,255,255,.85);
  text-align: center;
  pointer-events: none;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  z-index: 1;
}
.hm-sw-actions-handles {
  position: absolute;
  inset: 0;
  z-index: 2;
}
.hm-sw-actions-handle {
  position: absolute;
  transform: translate(-50%, -50%);
  cursor: grab;
  z-index: 2;
  touch-action: none;
}
.hm-sw-actions-handle:active { cursor: grabbing; }
.hm-sw-actions-handle.is-selected .hm-sw-actions-handle-dot {
  border-color: #0ea5e9;
  box-shadow: 0 0 0 3px rgba(14,165,233,.45), 0 2px 8px rgba(0,0,0,.28);
}
.hm-sw-actions-handle.is-selected {
  z-index: 5;
}
.hm-sw-actions-handle-dot {
  width: var(--hm-sw-action-pad-size, 14px);
  height: var(--hm-sw-action-pad-size, 14px);
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  display: grid;
  place-items: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.28);
  font-size: calc(var(--hm-sw-action-pad-size, 14px) * 0.42);
  color: #1c1917;
  border: 1.5px solid rgba(245,158,11,.85);
  box-sizing: border-box;
}
.hm-sw-actions-handle-dot .fa-whatsapp { color: #128C7E; }
.hm-sw-actions-handle-dot .fa-phone { color: #1a1a1a; }
.hm-sw-actions-handle-dot .fa-map-marker-alt { color: #e11d48; }
.hm-sw-actions-handle-dot .fa-instagram { color: #e1306c; }
.hm-sw-actions-handle-dot .fa-facebook-f { color: #1877f2; }
.hm-sw-actions-handle-dot .fa-youtube { color: #ff0000; }
.hm-sw-actions-handle-dot .fa-tiktok { color: #111; }
.hm-sw-actions-handle-dot .fa-snapchat { color: #c9a800; }
.hm-sw-actions-handle-dot .fa-google { color: #4285f4; }