/* Zidos · W2E: настройки ИИ и правила согласования.
   Только токены из tokens.css; без рамок, полос, градиентов и свечений; отступы 4/8/12/16/20/24. */

/* ===== вкладка «ИИ» ===== */
.w2e-ai { container-type: inline-size; display: grid; gap: var(--sp-8); min-width: 0; }
.w2e-block { display: grid; gap: var(--sp-8); margin-top: var(--sp-24); min-width: 0; }
.w2e-block:first-child { margin-top: var(--sp-8); }
.w2e-lead { color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); margin: 0; }
.w2e-sub { margin: var(--sp-16) 0 0; font-size: var(--fs-h4); font-weight: var(--fw-h4); line-height: var(--lh-body); color: var(--muted); }
.w2e-list { display: grid; gap: var(--sp-8); min-width: 0; }
.w2e-list > .section-row, .w2e-list > .w2e-item { margin: 0; }
.w2e-actions { display: flex; flex-wrap: wrap; gap: var(--sp-8); margin-top: var(--sp-4); }
.w2e-note { color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); margin: 0; }
.w2e-state { flex: none; font-size: var(--fs-small); color: var(--muted); white-space: nowrap; }
.w2e-state[data-state="ok"] { color: var(--ok); }
.w2e-state[data-state="warn"] { color: var(--attention); }
.w2e-row > .cap { flex: none; }

/* карточка с несколькими строками: заголовок строки, действие справа */
.w2e-item { display: grid; gap: var(--sp-8); padding: var(--pad-row); border-radius: var(--radius-card); background: var(--raised); min-width: 0; }
.w2e-item-head { display: flex; align-items: center; gap: var(--sp-12); min-width: 0; }
.w2e-item-head .section-row-copy { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.w2e-item-head strong { display: block; font-size: var(--fs-body); font-weight: 550; }
.w2e-item-head small { display: block; margin-top: var(--sp-4); color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); }
.w2e-item-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-8); padding-left: calc(var(--icon-row) + var(--sp-12)); }
.w2e-diag { display: grid; gap: var(--sp-8); margin-left: calc(var(--icon-row) + var(--sp-12)); padding: var(--sp-12) var(--sp-16); border-radius: var(--radius-inner); background: var(--panel); font-size: var(--fs-small); }
.w2e-diag[hidden] { display: none; }
.w2e-diag > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--sp-4) var(--sp-16); }
.w2e-diag span { color: var(--muted); }
.w2e-diag strong { font-weight: 550; text-align: right; overflow-wrap: anywhere; }

/* переключатель: подпись слева, дорожка справа; зона нажатия 44 */
.w2e-switch { display: inline-flex; align-items: center; gap: var(--sp-12); min-height: 44px; font-size: var(--fs-small); cursor: pointer; }
.w2e-switch input { appearance: none; -webkit-appearance: none; flex: none; position: relative; width: 44px; height: 26px; margin: 0; border-radius: var(--radius-pill); background: color-mix(in srgb, var(--faint) 45%, var(--frame)); cursor: pointer; transition: background-color var(--dur-fast) var(--ease); }
.w2e-switch input::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--frame); transition: transform var(--dur-fast) var(--ease); }
.w2e-switch input:checked { background: var(--ink-button); }
.w2e-switch input:checked::after { background: var(--ink-button-text); transform: translateX(18px); }
.w2e-switch input:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.w2e-publish-row .w2e-switch, .w2e-row > .w2e-switch { flex: none; }

/* поля */
.w2e-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--sp-12); }
.w2e-fields label, .w2e-form label { display: grid; gap: var(--sp-8); font-size: var(--fs-small); color: var(--muted); min-width: 0; }
.w2e-fields input, .w2e-form input:not([type=checkbox]), .w2e-form select, .w2e-fields select { width: 100%; min-width: 0; height: 44px; border: 0; border-radius: var(--radius-field); background: var(--panel); color: var(--ink); padding: 0 var(--sp-16); font-size: 16px; }
.w2e-fields select, .w2e-form select { padding-right: 40px; }
.w2e-form input:focus-visible, .w2e-fields input:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.w2e-routes { display: grid; gap: var(--sp-16); }
.w2e-route { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-12); align-items: end; }
.w2e-route-name { display: grid; gap: var(--sp-4); align-self: center; }
.w2e-route-name small { color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); }
.w2e-route label { display: grid; gap: var(--sp-8); font-size: var(--fs-small); color: var(--muted); min-width: 0; }
.w2e-route select { width: 100%; background: var(--panel); }
.w2e-publish { display: grid; gap: var(--sp-8); }
.w2e-publish-row { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-12); min-width: 0; }
.w2e-publish-row .section-row-copy { flex: 1; min-width: 0; }

/* журнал: свёрнутый блок */
.w2e-fold { border-radius: var(--radius-card); background: var(--frame); }
.w2e-fold > summary { display: flex; align-items: center; justify-content: space-between; min-height: var(--h-row); padding: 0 var(--pad-row) 0 var(--pad-card); font-size: var(--fs-body); font-weight: 550; cursor: pointer; list-style: none; }
.w2e-fold > summary::-webkit-details-marker { display: none; }
.w2e-fold > summary span { color: var(--muted); font-weight: 400; font-size: var(--fs-small); }
.w2e-fold > summary:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; border-radius: var(--radius-card); }
.w2e-log { display: grid; gap: var(--sp-8); padding: 0 var(--pad-card) var(--pad-card); font-size: var(--fs-small); }
.w2e-log-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: var(--sp-12); }
.w2e-log-row > span { color: var(--muted); overflow-wrap: anywhere; }

@container (max-width: 640px) {
  .w2e-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .w2e-route { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .w2e-route-name { grid-column: 1 / -1; }
  .w2e-log-row { grid-template-columns: 48px minmax(0, 1fr); }
  .w2e-log-row > :nth-child(n+3) { grid-column: 2; }
}
@container (max-width: 420px) {
  .w2e-fields, .w2e-route { grid-template-columns: minmax(0, 1fr); }
  .w2e-item-foot, .w2e-diag { padding-left: 0; margin-left: 0; }
}

/* строки настроек ИИ: на узком экране действие уходит под текст, а не сжимает его */
.w2e-row { flex-wrap: wrap; }
.w2e-row .section-row-copy { flex: 1 1 160px; min-width: 0; overflow-wrap: anywhere; }

/* ===== лист (одно окно для провайдера, сервера, навыка, правила) ===== */
dialog.w2e-sheet { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: var(--ink); overflow: visible; }
dialog.w2e-sheet:not([open]) { display: none; }
dialog.w2e-sheet[open] { display: grid; place-items: center; }
dialog.w2e-sheet::backdrop { background: var(--scrim); }
.w2e-sheet-box { display: flex; flex-direction: column; width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); border-radius: var(--radius-card); background: var(--frame); box-shadow: var(--shadow); animation: w2e-in var(--dur-base) var(--ease) both; }
@keyframes w2e-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.w2e-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-12); padding: var(--sp-24) var(--sp-24) var(--sp-12); }
.w2e-sheet-head h2 { font-size: var(--fs-h2); font-weight: var(--fw-h2); line-height: var(--lh-title); }
.w2e-sheet-body { display: grid; gap: var(--sp-16); padding: var(--sp-4) var(--sp-24) var(--sp-16); overflow-y: auto; overscroll-behavior: contain; min-height: 0; }
.w2e-sheet-body > p { color: var(--muted); font-size: var(--fs-body); line-height: var(--lh-body); }
.w2e-sheet-foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--sp-8); padding: var(--sp-12) var(--sp-24) var(--sp-24); }
.w2e-sheet-foot .w2e-foot-note { flex: 1 1 100%; color: var(--muted); font-size: var(--fs-small); }
.w2e-form { display: grid; gap: var(--sp-16); }
.w2e-group { display: grid; gap: var(--sp-8); min-width: 0; margin: 0; padding: 0; border: 0; }
.w2e-group > legend { padding: 0; margin-bottom: var(--sp-8); font-size: var(--fs-small); color: var(--muted); }
.w2e-group-card { display: grid; gap: var(--sp-12); padding: var(--sp-16); border-radius: var(--radius-inner); background: var(--panel); min-width: 0; }
.w2e-group-card input:not([type=checkbox]), .w2e-group-card select { background: var(--frame); }
.w2e-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-12); }
.w2e-check { display: flex; align-items: center; gap: var(--sp-12); min-height: 44px; font-size: var(--fs-body); color: var(--ink); cursor: pointer; }
.w2e-check input { width: 20px; height: 20px; flex: none; margin: 0; accent-color: var(--ink-button); }
.w2e-check input:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.w2e-err { color: var(--bad); font-size: var(--fs-small); }
.w2e-err[hidden] { display: none; }

/* сегмент внутри листа и панели правил */
.w2e-seg { display: flex; align-items: center; gap: 2px; min-height: var(--h-seg-box); padding: var(--sp-4); border-radius: var(--radius-pill); background: var(--panel); max-width: 100%; }
.w2e-seg > button { flex: 1 1 0; min-width: 0; height: 40px; min-height: 40px; padding: 0 var(--sp-12); border-radius: var(--radius-pill); font-size: var(--fs-small); font-weight: 550; line-height: 1.2; white-space: nowrap; color: var(--ink); background: transparent; transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.w2e-seg > button[aria-pressed="true"] { background: var(--ink-button); color: var(--ink-button-text); }
.w2e-seg > button:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }
.w2e-seg > button[aria-pressed="true"]:focus-visible { outline-color: var(--ink-button-text); }
.w2e-sheet-box :is(button, input, select):focus-visible { outline-offset: -2px; }
.w2e-sheet-box button.cap:focus-visible, .w2e-sheet-box button.primary:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }

@media (max-width: 600px) {
  dialog.w2e-sheet[open] { place-items: end center; }
  .w2e-sheet-box { width: 100%; max-height: calc(100dvh - 24px); border-radius: var(--radius-card) var(--radius-card) 0 0; }
  .w2e-sheet-head, .w2e-sheet-body, .w2e-sheet-foot { padding-left: var(--sp-20); padding-right: var(--sp-20); }
  .w2e-sheet-foot { padding-bottom: max(var(--sp-20), env(safe-area-inset-bottom)); }
  .w2e-two { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .w2e-sheet-box { animation: none; }
  .w2e-switch input, .w2e-switch input::after, .w2e-seg > button { transition: none; }
}

/* ===== панель «Правила согласования» на экране проверки ===== */
.w2e-rules { grid-column: 1 / -1; display: grid; gap: var(--sp-16); margin-top: var(--sp-16); padding: var(--sp-24); border-radius: var(--radius-card); background: var(--raised); min-width: 0; container-type: inline-size; }
.w2e-rules-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-12); }
.w2e-rules-head h3 { font-size: var(--fs-h2); font-weight: var(--fw-h2); line-height: var(--lh-title); margin: 0; }
.w2e-rules-head p { margin: var(--sp-4) 0 0; color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); }
.w2e-rule-list { display: grid; gap: var(--sp-8); list-style: none; margin: 0; padding: 0; }
.w2e-rule { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-8) var(--sp-16); align-items: center; padding: var(--sp-16); border-radius: var(--radius-inner); background: var(--panel); min-width: 0; }
.w2e-rule[data-off="true"] .w2e-rule-body { opacity: .55; }
.w2e-rule-body { display: grid; gap: var(--sp-8); min-width: 0; }
.w2e-rule-title { font-size: var(--fs-body); font-weight: 600; overflow-wrap: anywhere; }
.w2e-rule-lines { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-8) var(--sp-16); margin: 0; }
.w2e-rule-lines > div { display: grid; gap: var(--sp-4); min-width: 0; align-content: start; }
.w2e-rule-lines dt { color: var(--muted); font-size: var(--fs-small); }
.w2e-rule-lines dd { margin: 0; font-size: var(--fs-small); line-height: var(--lh-body); overflow-wrap: anywhere; }
.w2e-rule-side { display: flex; flex-direction: column; align-items: flex-end; gap: var(--sp-4); }
.w2e-rule-side button.cap { min-height: 44px; }
.w2e-rules-global { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8) var(--sp-24); }
.w2e-rules-global label.w2e-ttl { display: flex; align-items: center; gap: var(--sp-12); font-size: var(--fs-small); color: var(--muted); }
.w2e-rules-global select { height: 44px; border: 0; border-radius: var(--radius-field); background: var(--panel); padding: 0 40px 0 var(--sp-16); font-size: var(--fs-body); width: auto; }
.w2e-sources { display: grid; gap: var(--sp-12); padding: var(--sp-24) 0 0; min-width: 0; }
.w2e-sources h4 { margin: 0; }
.w2e-sources .w2e-seg { background: var(--panel); }
.w2e-groups { display: grid; gap: var(--sp-8); }
.w2e-grp { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--sp-4) var(--sp-16); padding: var(--sp-12) var(--sp-16); border-radius: var(--radius-sm); background: var(--panel); font-size: var(--fs-small); }
.w2e-grp strong { font-weight: 550; font-size: var(--fs-body); }
.w2e-grp span { color: var(--muted); }
.w2e-map { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: var(--sp-12); align-items: center; font-size: var(--fs-small); }
.w2e-map code { font-family: var(--z-font-code); font-size: 12px; overflow-wrap: anywhere; color: var(--ink); }
.w2e-map select { height: 44px; border: 0; border-radius: var(--radius-field); padding: 0 40px 0 var(--sp-16); font-size: var(--fs-small); width: 100%; min-width: 0; background: var(--panel); }
.w2e-map-arrow { color: var(--muted); }
.w2e-sync { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-8) var(--sp-16); font-size: var(--fs-small); color: var(--muted); }
.w2e-sync [data-state="ok"] { color: var(--ok); }
.w2e-future { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-8); color: var(--muted); font-size: var(--fs-small); }
.w2e-future span.w2e-chip { padding: var(--sp-8) var(--sp-12); border-radius: var(--radius-pill); background: var(--panel); color: var(--ink); }
.w2e-sources .w2e-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.w2e-sources .w2e-fields input, .w2e-sources .w2e-fields select { background: var(--panel); }
.w2e-sources[hidden], .w2e-source-pane[hidden] { display: none; }
.w2e-pending { color: var(--muted); font-size: var(--fs-small); line-height: var(--lh-body); margin: 0; }

@container (max-width: 620px) {
  .w2e-rule { grid-template-columns: minmax(0, 1fr); }
  .w2e-rule-lines { grid-template-columns: minmax(0, 1fr); }
  .w2e-rule-side { flex-direction: row; align-items: center; justify-content: space-between; }
  .w2e-map { grid-template-columns: minmax(0, 1fr); }
  .w2e-map-arrow { display: none; }
  .w2e-sources .w2e-fields { grid-template-columns: minmax(0, 1fr); }
}

/* ряды переключателей в карточке: ровная высота и зазор */
.w2e-publish-row { min-height: var(--h-row); padding: var(--sp-4) 0; }
.w2e-publish > .w2e-publish-row + .w2e-publish-row { margin-top: var(--sp-4); }
.w2e-ai .agent-editor-actions { margin-top: var(--sp-24); }

/* узкая панель: источник групп не шире панели, сегмент в столбик */
.w2e-sources, .w2e-source-pane, .w2e-groups, .w2e-sources .w2e-fields > label, .w2e-map > * { min-width: 0; max-width: 100%; }
.w2e-sources .w2e-groups { display: grid; }
@container (max-width: 620px) {
  .w2e-sources .w2e-seg { flex-direction: column; align-items: stretch; border-radius: var(--radius-inner); }
  .w2e-sources .w2e-seg > button { white-space: normal; }
  .w2e-rules-global { flex-direction: column; align-items: flex-start; }
  .w2e-rules-global label.w2e-ttl { flex-wrap: wrap; }
}
.w2e-sources .cap:not(.cap--quiet) { background: var(--panel); }

/* действие справа от текста строки не уходит вниз; строки с переключателем могут переноситься */
.w2e-row { flex-wrap: nowrap; }
.w2e-row .section-row-copy { flex: 1 1 0; }
.w2e-row:has(.w2e-switch) { flex-wrap: wrap; }
.w2e-row:has(.w2e-switch) .section-row-copy { flex: 1 1 140px; }
.w2e-side { display: flex; flex-direction: column; align-items: flex-end; gap: 0; flex: none; }
.w2e-side .w2e-state { padding-right: var(--sp-12); }
.w2e-sheet-foot > button { width: auto; flex: 0 0 auto; }
.w2e-sheet-head .icon-btn { font-size: 22px; line-height: 1; color: var(--ink); }
.w2e-sources .w2e-fields label:nth-child(3) { grid-column: 1 / -1; }
dialog.w2e-sheet::backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
body dialog.w2e-sheet .w2e-form :is(input:not([type=checkbox]), select) { background-color: var(--panel); color: var(--ink); height: 44px; border-radius: var(--radius-field); padding: 0 var(--sp-16); }
body dialog.w2e-sheet .w2e-form select { padding-right: 40px; }
body dialog.w2e-sheet .w2e-group-card :is(input:not([type=checkbox]), select) { background-color: var(--frame); }
body dialog.w2e-sheet .w2e-form label.w2e-check { display: flex; flex-direction: row; gap: var(--sp-12); color: var(--ink); font-size: var(--fs-body); }
body dialog.w2e-sheet .w2e-form input::placeholder { color: var(--faint); }
