/* Ekran 07 — Otomasyonlar · 08 — Düzenleme · 09 — Adım ekleme. Mobile "Otomasyon" tab hosts Gruplar + Otomasyonlar as two top tabs. */
.section-switch { display: none; }
@media (max-width: 767px) {
  .section-switch { display: flex; }
}

.auto-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.automation-card__top .switch { flex: none; }
.automation-card__brand { display: inline-flex; align-items: center; gap: var(--sp-1); }

/* Yeni otomasyon seçimi (masaüstü menü, mobilde alttan sayfa) */
.new-anchor { position: relative; }
.new-menu { top: calc(100% + var(--sp-2)); right: 0; min-width: var(--size-320); padding: var(--sp-2); }
.new-sheet { display: flex; flex-direction: column; gap: var(--sp-1); }
.new-opt { display: flex; align-items: flex-start; gap: var(--sp-3); width: 100%; padding: var(--sp-3); border-radius: var(--r-md); text-align: left; }
.new-opt:hover { background: var(--surface-hover); }
.new-opt__icon { display: grid; place-items: center; width: var(--size-40); height: var(--size-40); border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); flex: none; }
.new-opt--ai .new-opt__icon { background: var(--primary-soft); border-color: transparent; color: var(--primary); }
.new-opt__text { display: flex; flex-direction: column; gap: var(--sp-0-5); }
.new-opt__name { font-size: var(--text-body); font-weight: var(--w-semibold); display: flex; align-items: center; gap: var(--sp-2); }
.new-opt__sub { font-size: var(--text-sm); color: var(--text-3); }

/* Editör */
.editor-card__head--trigger { background: var(--primary-soft); border-bottom-color: transparent; }
.editor-card__head--trigger .editor-card__title { color: var(--primary-soft-text); white-space: nowrap; flex: none; }
.mode-select { display: inline-flex; align-items: center; gap: var(--sp-1-5); height: var(--control-h-sm); padding: 0 var(--sp-2) 0 var(--sp-3); border-radius: var(--r-sm); border: 1px solid var(--border); background: var(--surface); font-size: var(--text-sm); font-weight: var(--w-medium); color: var(--text); min-width: 0; text-align: left; }
.mode-select span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mode-select .icon { width: var(--size-14); height: var(--size-14); color: var(--text-3); }
.editor-card__sub { padding: var(--sp-2) var(--sp-4); font-size: var(--text-sm); color: var(--text-3); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-2); }
.editor-card__sub .icon { width: var(--size-14); height: var(--size-14); }
.step-row__num { width: var(--size-20); text-align: right; font-size: var(--text-xs); color: var(--text-3); font-variant-numeric: tabular-nums; flex: none; }
.schedule-row { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.schedule-row__text { display: flex; flex-direction: column; gap: var(--sp-0-5); }
.schedule-row__label { font-weight: var(--w-medium); }
.schedule-row__value { font-size: var(--text-sm); color: var(--text-3); }
.editor__footer--auto { align-items: center; }
.editor__status { margin-right: auto; display: flex; align-items: center; gap: var(--sp-2); font-size: var(--text-sm); color: var(--text-3); }
.editor__status .status-dot { width: var(--size-7); height: var(--size-7); border-radius: 50%; background: var(--success); flex: none; }
.editor__status .status-dot.is-off { background: var(--offline); }
.prompt-note { display: flex; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border-radius: var(--r-lg); background: var(--scene-purple-bg); color: var(--text-2); font-size: var(--text-sm); }
.prompt-note .icon { color: var(--scene-purple); flex: none; margin-top: var(--sp-0-5); }
.prompt-note em { font-style: normal; color: var(--text); }

/* Yayınlama */
.publish { position: fixed; inset: 0; z-index: var(--z-sheet); display: grid; place-items: center; background: var(--overlay); animation: fade-in var(--dur) var(--ease); }
.publish__card { width: min(var(--drawer-w), calc(100% - var(--sp-8))); background: var(--surface); border-radius: var(--r-xl); box-shadow: var(--shadow-lg); padding: var(--sp-6); display: flex; flex-direction: column; gap: var(--sp-5); }
.publish__title { font-size: var(--text-h2); font-weight: var(--w-semibold); }
.publish__name { font-size: var(--text-sm); color: var(--text-3); margin-top: var(--sp-0-5); }
.publish__steps { display: flex; flex-direction: column; gap: var(--sp-3); }
.publish__step { display: flex; align-items: center; gap: var(--sp-3); font-size: var(--text-body); color: var(--text-3); }
.publish__dot { display: grid; place-items: center; width: var(--size-28); height: var(--size-28); border-radius: 50%; border: 1px solid var(--border); color: transparent; flex: none; }
.publish__dot .icon { width: var(--size-14); height: var(--size-14); stroke-width: 3; }
.publish__step.is-active { color: var(--text); font-weight: var(--w-medium); }
.publish__step.is-active .publish__dot { border-color: var(--primary); color: var(--primary); }
.publish__step.is-active .publish__dot .icon { animation: spin 1s linear infinite; }
.publish__step.is-done { color: var(--text-2); }
.publish__step.is-done .publish__dot { background: var(--success); border-color: var(--success); color: var(--on-accent); }
.publish__bar { height: var(--size-4); border-radius: var(--r-2xs); background: var(--track); overflow: hidden; }
.publish__fill { height: 100%; width: var(--pct, 0%); background: var(--primary); transition: width .8s var(--ease); }
.publish.is-done .publish__fill { background: var(--success); }
.publish__success { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); text-align: center; padding: var(--sp-2) 0; }
.publish__check { display: grid; place-items: center; width: var(--size-56); height: var(--size-56); border-radius: 50%; background: var(--success-bg); color: var(--success); }
.publish__check .icon { width: var(--size-28); height: var(--size-28); stroke-width: 2.5; }
.publish__actions { display: flex; gap: var(--sp-2); }
.publish__actions .btn { flex: 1; }

/* Adım ekleme seçici */
.picker-steps { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); font-size: var(--text-xs); color: var(--text-3); font-weight: var(--w-medium); }
.picker-steps span.is-active { color: var(--primary); }
.picker-steps .icon { width: var(--size-12); height: var(--size-12); }
.pick-results { display: flex; flex-direction: column; gap: var(--sp-4); }
.pick-group { display: flex; flex-direction: column; gap: var(--sp-2); }
.pick-group__title { font-size: var(--text-xs); font-weight: var(--w-medium); color: var(--text-3); padding: 0 var(--sp-1); }
.pick-row { display: flex; align-items: center; gap: var(--sp-3); min-height: var(--size-52); padding: 0 var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); width: 100%; text-align: left; }
.pick-row:hover { background: var(--surface-hover); }
.pick-row__icon { display: grid; place-items: center; width: var(--control-h-sm); height: var(--control-h-sm); border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); flex: none; }
.pick-row__text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.pick-row__name { font-size: var(--text-sm); font-weight: var(--w-medium); }
.pick-row__sub { font-size: var(--text-xs); color: var(--text-3); }
.pick-row.is-offline { opacity: .55; }
.prop-list { display: flex; flex-direction: column; gap: var(--sp-4); }
.prop { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--border); border-radius: var(--r-lg); }
.prop.is-active { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.prop__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); width: 100%; font-size: var(--text-body); font-weight: var(--w-medium); text-align: left; color: var(--text); }
.prop__head .check { width: var(--size-20); height: var(--size-20); border-radius: 50%; border: 2px solid var(--border-strong); display: grid; place-items: center; color: transparent; flex: none; }
.prop.is-active .prop__head .check { background: var(--primary); border-color: var(--primary); color: var(--on-accent); }
.prop__head .check .icon { width: var(--size-12); height: var(--size-12); stroke-width: 3; }
.prop__body { display: flex; flex-direction: column; gap: var(--sp-2); }
.prop--locked { opacity: .6; }
.prop--locked .prop__head { color: var(--text-3); cursor: not-allowed; }
.cmp-row { display: flex; align-items: center; gap: var(--sp-2); }
.cmp-row .input { width: var(--size-96); text-align: center; font-variant-numeric: tabular-nums; }
.cmp-row__unit { font-size: var(--text-sm); color: var(--text-3); }
.var-source { display: flex; flex-wrap: wrap; gap: var(--sp-1); align-items: center; font-size: var(--text-xs); color: var(--text-3); }
.var-source .var-chip { cursor: pointer; border: 0; }
.time-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }

@media (max-width: 767px) {
  .new-menu { display: none; }
  .editor__status { display: none; }
}
