/* =========================================================
   Modo de execução — seletor no topo, menu e Configurações
   ========================================================= */
.exec-picker {
  display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 10px 0 6px; border-radius: 12px;
  font-size: 14px; font-weight: 500; transition: background-color .2s;
}
.exec-picker:hover, .exec-picker[aria-expanded="true"] { background: rgb(0 0 0 / .05); }
.dark .exec-picker:hover, .dark .exec-picker[aria-expanded="true"] { background: rgb(255 255 255 / .05); }
.exec-picker .label { white-space: nowrap; }
.exec-dot { display: grid; place-items: center; height: 24px; width: 24px; border-radius: 999px; }
.exec-picker[data-mode="read"] .exec-dot { background: rgb(14 165 233 / .14); color: rgb(3 105 161); }
.exec-picker[data-mode="ask"] .exec-dot { background: rgb(245 158 11 / .16); color: rgb(180 83 9); }
.exec-picker[data-mode="auto"] .exec-dot { background: rgb(34 197 94 / .16); color: rgb(21 128 61); }
.dark .exec-picker[data-mode="read"] .exec-dot { color: rgb(125 211 252); }
.dark .exec-picker[data-mode="ask"] .exec-dot { color: rgb(252 211 77); }
.dark .exec-picker[data-mode="auto"] .exec-dot { color: rgb(134 239 172); }
@media (max-width: 767px) { .exec-picker .label, .exec-picker .chev { display: none; } .exec-picker { padding: 0 6px; } }

#execMenu { width: 340px; max-height: min(560px, calc(var(--vh100) - 80px)); overflow-y: auto; }
.exec-item { align-items: flex-start; }
.exec-item .meta { min-width: 0; flex: 1; text-align: left; }
.exec-item .meta b { display: block; font-weight: 500; }
.exec-item .meta small { display: block; font-size: 12px; line-height: 1.4; color: rgb(115 115 115); }
.dark .exec-item .meta small { color: rgb(163 163 163); }
.exec-item .check { margin-top: 2px; opacity: 0; transform: scale(.5); transition: opacity .2s, transform .3s var(--ease-out); }
.exec-item.selected .check { opacity: 1; transform: none; }
.exec-ico { display: grid; place-items: center; height: 30px; width: 30px; flex-shrink: 0; border-radius: 10px; }
.ex-read.exec-ico, .exec-tag.ex-read { background: rgb(14 165 233 / .12); color: rgb(3 105 161); }
.ex-ask.exec-ico, .exec-tag.ex-ask { background: rgb(245 158 11 / .14); color: rgb(180 83 9); }
.ex-auto.exec-ico, .exec-tag.ex-auto { background: rgb(34 197 94 / .14); color: rgb(21 128 61); }
.dark .ex-read.exec-ico, .dark .exec-tag.ex-read { color: rgb(125 211 252); }
.dark .ex-ask.exec-ico, .dark .exec-tag.ex-ask { color: rgb(252 211 77); }
.dark .ex-auto.exec-ico, .dark .exec-tag.ex-auto { color: rgb(134 239 172); }
.exec-mod { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 8px; font-size: 13px; }
.exec-tag { flex-shrink: 0; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; }

/* ---------- Configurações → Execução ---------- */
.exec-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 640px) { .exec-modes { grid-template-columns: 1fr; } }
.exec-mode { position: relative; cursor: pointer; }
.exec-mode input { position: absolute; opacity: 0; pointer-events: none; }
.exec-mode > span {
  display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 8px; height: 100%; padding: 14px; border-radius: 16px;
  border: 1px solid rgb(0 0 0 / .1); background: #fff; transition: border-color .2s, box-shadow .2s;
}
.dark .exec-mode > span { background: rgb(255 255 255 / .02); border-color: rgb(255 255 255 / .1); }
.exec-mode b { font-weight: 600; font-size: 14px; }
.exec-mode small { font-size: 12.5px; line-height: 1.45; color: rgb(115 115 115); }
.dark .exec-mode small { color: rgb(163 163 163); }
.exec-mode input:checked + span { border-color: rgb(124 58 237 / .6); box-shadow: 0 0 0 3px rgb(124 58 237 / .12); }
.exec-mode input:focus-visible + span { outline: 2px solid rgb(139 92 246 / .6); outline-offset: 2px; }
.exec-rule-row { display: grid; grid-template-columns: minmax(0, 1fr) 190px; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgb(0 0 0 / .06); }
.dark .exec-rule-row { border-color: rgb(255 255 255 / .06); }
.exec-rule-row:last-child { border-bottom: 0; }
@media (max-width: 560px) { .exec-rule-row { grid-template-columns: 1fr; gap: 8px; } }
