/* Модуль «Термы» — стили терма, чата и подтверждений, перенесены из кабинета nuadmin (web/kabinet/style.css). */
/* терм */
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(../vendor/jbmono-latin-400.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 700; font-display: swap; src: url(../vendor/jbmono-latin-700.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(../vendor/jbmono-cyrillic-400.woff2) format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 700; font-display: swap; src: url(../vendor/jbmono-cyrillic-700.woff2) format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }

/* окно терма — как окно Терминала macOS */
.termwin { border-radius: 12px; overflow: hidden; background: #1a1b1e; border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 0 0 .5px rgba(0,0,0,.6), 0 18px 50px rgba(0,0,0,.35), 0 4px 12px rgba(0,0,0,.2); }
.termbar { display: flex; gap: 10px; align-items: center; height: 36px; padding: 0 10px 0 14px;
  background: linear-gradient(#34353a, #2a2b2f); border-bottom: 1px solid #111; color: #c9cbd1; font-size: 13px; }
.termbar .lights { display: flex; gap: 8px; flex: none; }
.termbar .lights i { width: 12px; height: 12px; border-radius: 50%; background: #ff5f57; box-shadow: inset 0 0 0 .5px rgba(0,0,0,.25); }
.termbar .lights i:nth-child(2) { background: #febc2e; }
.termbar .lights i:nth-child(3) { background: #28c840; }
.termbar .ttl { flex: 1; min-width: 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.termbar .st { font-weight: 400; color: #8b8e96; }
.termbar .typing { font-weight: 500; color: #f5a524; padding: 1px 8px; border-radius: 6px; background: rgba(245, 165, 36, .14); }
.termbar .typing.flash { animation: typing-flash .6s ease; }
@keyframes typing-flash { 0%, 100% { background: rgba(245, 165, 36, .14); } 30% { background: rgba(245, 165, 36, .55); } }
#term-host.locked { box-shadow: inset 0 0 0 2px rgba(245, 165, 36, .55); }
@media (prefers-reduced-motion: reduce) { .termbar .typing.flash { animation: none; } }
.termbar .tfont { display: flex; gap: 4px; align-items: center; flex: none; }
.termbar select, .termbar .tbtn { font: inherit; font-size: 12px; color: #c9cbd1; background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1); border-radius: 6px; padding: 3px 7px; cursor: pointer; }
.termbar select:hover, .termbar .tbtn:hover { background: rgba(255,255,255,.12); }
.termbar select option { color: #151515; background: #fff; }
/* Отступ — на .xterm, не на #term-host: addon-fit берёт полную высоту
 * родителя (при border-box вместе с padding) и вычитает padding только
 * у .xterm, иначе лишняя строка уходит под нижний край окна. */
.term { height: calc(100vh - var(--u) - 196px); min-height: 320px; background: #1a1b1e; }
#term-host.drop { box-shadow: inset 0 0 0 2px var(--line); }
.termhint { margin: 8px 2px 0; font-size: 12px; line-height: 1.5; color: var(--mute); }
.termhint b { color: var(--ink2); font-weight: 600; }
.tm kbd { font-family: var(--mono); font-size: 11px; padding: 0 4px; border: 1px solid var(--grid); border-bottom-width: 2px; border-radius: 4px; background: var(--cell); color: var(--ink); white-space: nowrap; }
.fsend { position: fixed; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0,0,0,.45); }
.fsend-box { background: var(--cell); color: var(--ink); border-top: var(--bw) solid var(--line); padding: 18px 20px; width: min(560px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; gap: 10px; box-shadow: 0 18px 50px rgba(0,0,0,.35); }
.fsend-box h2 { margin: 0; }
.fsend-meta { margin: 0; font-family: var(--mono); font-size: 12px; color: var(--mute); word-break: break-all; }
.fsend-img { max-width: 100%; max-height: 50vh; object-fit: contain; align-self: center; border: 1px solid var(--grid); background: var(--bg); }
.fsend-txt { margin: 0; max-height: 40vh; overflow: auto; font-family: var(--mono); font-size: 12px; white-space: pre-wrap; word-break: break-word; padding: 8px 10px; background: var(--bg); border: 1px solid var(--grid); }
.fsend-box .err { margin: 0; }
.fsend-btns { display: flex; gap: 8px; justify-content: flex-end; }
.fsend-btns kbd { margin-left: 4px; background: transparent; color: inherit; border-color: currentColor; opacity: .7; }
.term .xterm { height: 100%; padding: 8px 4px 4px 10px; }
.term .xterm-viewport { scrollbar-width: thin; scrollbar-color: #4a4c52 transparent; }
.term.viewonly { height: calc(100vh - var(--u) - 210px); }
@media (max-width: 720px) { .termbar .tfont, .termbar .lights { display: none; } .termwin { border-radius: 10px; } }
.termkeys { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.termkeys .btn { min-width: 52px; min-height: 44px; }

/* чат с сессией Claude терма: лента + поле ввода, терминал — ниже, свёрнут */
.chat { display: flex; flex-direction: column; height: calc(100vh - var(--u) - 150px); min-height: 360px;
  resize: vertical; overflow: hidden; border-radius: 12px; border: 1px solid var(--grid); background: var(--cell);
  box-shadow: 0 8px 30px rgba(0,0,0,.12); }
.chatbody { flex: 1; min-height: 0; display: flex; }
.chatmain { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.chatlist { width: 240px; flex: none; overflow: auto; border-right: 1px solid var(--grid); padding: 8px 6px;
  font-family: var(--sans); font-size: 13px; scrollbar-width: thin; }
.chatlist .cfold { color: var(--mute); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; margin: 10px 8px 4px; }
.chatlist .cfold:first-child { margin-top: 2px; }
.chatlist .crow { display: flex; align-items: center; gap: 4px; border-radius: 6px; }
.chatlist .crow:hover { background: var(--bg); }
.chatlist .crow.on { background: var(--bg); box-shadow: inset 2px 0 0 var(--line); }
.chatlist .cgo { flex: 1; min-width: 0; text-align: left; font: inherit; color: var(--ink); background: none; border: 0;
  padding: 6px 8px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chatlist .cgo small { display: block; color: var(--mute); font-size: 11px; }
.chatlist .cact { flex: none; font: inherit; color: var(--mute); background: none; border: 0; padding: 4px 6px; cursor: pointer; }
.chatlist .cfind { width: 100%; box-sizing: border-box; font: inherit; padding: 5px 8px; margin-bottom: 4px;
  border: 1px solid var(--grid); border-radius: 6px; background: var(--bg); color: var(--ink); }
@media (min-width: 721px) { .chat.listclosed .chatlist { display: none; } }
@media (max-width: 720px) {
  .chatlist { position: absolute; z-index: 5; top: 0; bottom: 0; left: 0; width: 80%; background: var(--cell); box-shadow: 0 8px 30px rgba(0,0,0,.25); }
  .chatbody { position: relative; }
  .chat:not(.listopen) .chatlist { display: none; }
}
.chat.drop { box-shadow: inset 0 0 0 2px var(--line); }
.chatbar .tbtn.arm { color: #fff; background: var(--bad, #d33); border-color: transparent; }
.chatbar select { max-width: 11em; }
.chatbar #chat-mode option[value="bypassPermissions"] { color: #f5a524; }
.chat.busy .chatbar .st::after { content: ' · отвечает…'; color: #f5a524; }
.chatfeed { flex: 1; min-height: 0; overflow: auto; padding: 14px 16px 8px; display: flex; flex-direction: column; gap: 10px;
  font-family: var(--sans); font-size: 15px; line-height: 1.5; color: var(--ink); scrollbar-width: thin; }
.msg { max-width: min(860px, 100%); overflow-wrap: anywhere; }
.msg.bot { align-self: flex-start; }
.msg.bot.live::after { content: '▍'; color: var(--mute); animation: chat-blink 1s steps(2) infinite; }
@keyframes chat-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .msg.bot.live::after { animation: none; } }
.msg.me { align-self: flex-end; max-width: min(680px, 88%); padding: 8px 12px; border-radius: 14px 14px 4px 14px;
  background: var(--acc); color: var(--acc-ink); white-space: pre-wrap; }
.msg.me .plain { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg.me .who { font-size: 12px; font-weight: 600; opacity: .85; }
.msg.me .at { font-size: 11px; opacity: .7; text-align: right; margin-top: 2px; }
.msg.sys { align-self: center; font-size: 12px; color: var(--mute); text-align: center; }
.msg.done { align-self: flex-start; font-size: 12px; color: var(--mute); }
.msg.done.bad { color: var(--bad, #d33); }
/* инструменты — одной сворачиваемой строкой */
.msg.tools { align-self: flex-start; font-size: 13px; color: var(--mute); border-left: 2px solid var(--grid); padding-left: 10px; }
.msg.tools > summary { cursor: pointer; list-style: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msg.tools > summary::-webkit-details-marker { display: none; }
.msg.tools > summary::before { content: '▸ '; }
.msg.tools[open] > summary::before { content: '▾ '; }
.msg.tools .tcount { font-weight: 600; color: var(--ink2); }
.msg.tools .tlast { margin-left: 6px; font-family: var(--mono); font-size: 12px; }
.tlist { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
.trow { font-family: var(--mono); font-size: 12px; }
.trow .tname { font-weight: 600; color: var(--ink2); margin-right: 6px; }
.trow.ok .tname::before { content: '✓ '; color: var(--ok, #2a2); }
.trow.fail .tname::before { content: '✗ '; color: var(--bad, #d33); }
.trow .tout { margin: 2px 0 0; max-height: 160px; overflow: auto; padding: 4px 8px; white-space: pre-wrap;
  background: var(--bg); border: 1px solid var(--grid); border-radius: 6px; }
/* разрешения */
.msg.perm { align-self: stretch; max-width: none; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--grid);
  border-left: 4px solid #f5a524; background: var(--bg); }
.msg.perm.allowed { border-left-color: var(--ok, #2a2); }
.msg.perm.denied { border-left-color: var(--bad, #d33); }
.msg.perm .ptitle { font-weight: 600; }
.msg.perm .pbrief { font-family: var(--mono); font-size: 13px; margin: 4px 0; white-space: pre-wrap; }
.msg.perm details summary { cursor: pointer; font-size: 12px; color: var(--mute); }
.msg.perm details pre { margin: 4px 0; max-height: 240px; overflow: auto; font-size: 12px; white-space: pre-wrap; }
.msg.perm .pact { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.msg.perm .pwhy { flex: 1; min-width: 160px; font: inherit; font-size: 13px; padding: 4px 8px; color: var(--ink);
  background: var(--cell); border: 1px solid var(--grid); border-radius: 6px; }
.msg.perm:not(.open) .pact { display: none; }
.msg.perm .pstate { font-size: 12px; color: var(--mute); margin-top: 4px; }
/* markdown ответа */
.md > :first-child { margin-top: 0; } .md > :last-child { margin-bottom: 0; }
.md p, .md ul, .md ol, .md blockquote, .md pre, .md .tblwrap { margin: 0 0 8px; }
.md ul, .md ol { padding-left: 22px; }
.md .h { font-weight: 700; margin: 12px 0 6px; } .md .h1 { font-size: 1.25em; } .md .h2 { font-size: 1.12em; }
.md code { font-family: var(--mono); font-size: .88em; padding: 1px 4px; border-radius: 4px; background: var(--bg); border: 1px solid var(--grid); }
.md pre { font-family: var(--mono); font-size: 12.5px; line-height: 1.45; padding: 8px 10px; overflow: auto;
  background: #1a1b1e; color: #e4e5e8; border-radius: 8px; white-space: pre; }
.md pre code { padding: 0; border: 0; background: none; color: inherit; font-size: inherit; }
.md blockquote { padding-left: 10px; border-left: 3px solid var(--grid); color: var(--ink2); }
.md .tblwrap { overflow: auto; }
.md table { border-collapse: collapse; font-size: 13px; }
.md th, .md td { border: 1px solid var(--grid); padding: 3px 8px; text-align: left; vertical-align: top; }
.md th { background: var(--bg); }
.md a { color: var(--acc); }
/* ввод */
.chatin { display: flex; gap: 8px; align-items: flex-end; padding: 8px 10px; border-top: 1px solid var(--grid); background: var(--bg); }
.chatin .tbtn { font: inherit; font-size: 13px; color: var(--ink2); background: transparent; border: 1px solid var(--grid);
  border-radius: 6px; padding: 5px 9px; cursor: pointer; }
#chat-text { flex: 1; min-width: 0; resize: none; font: inherit; font-size: 15px; line-height: 1.45; padding: 6px 10px;
  max-height: 40vh; color: var(--ink); background: var(--cell); border: 1px solid var(--grid); border-radius: 10px; }
#chat-text:focus { outline: none; border-color: var(--line); }
.chatquote { position: fixed; z-index: 15; font: inherit; font-size: 12px; padding: 3px 9px; border-radius: 6px; cursor: pointer;
  color: #fff; background: #2a2b2f; border: 0; box-shadow: 0 4px 14px rgba(0,0,0,.3); }
.termrow:not(:has(> :not([hidden]))) { display: none; } /* терм без чата: ни кнопки, ни лимитов — без пустого зазора */
.termrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 10px 0 8px; }
.termrow .termtoggle { margin: 0; }
.termrow #usage-meter { margin-left: auto; }
#term-box.under .term { height: 60vh; min-height: 280px; }
#term-box.under .term.viewonly { height: 55vh; }
@media (max-width: 720px) {
  .chat { height: calc(100vh - var(--u) - 120px); height: calc(100dvh - var(--u) - 120px); border-radius: 10px; resize: none; }
  .chatfeed { padding: 10px; font-size: 15px; }
  .msg.me { max-width: 92%; }
  #chat-text { font-size: 16px; }
  .chatbar { height: auto; min-height: 36px; flex-wrap: wrap; row-gap: 6px; padding: 6px 10px; }
  .chatbar .ttl { flex-basis: 100%; text-align: left; }
  .chatbar select { flex: 1; min-width: 0; max-width: none; font-size: 16px; }
}

/* окно «Подтверждения» во вкладке терма: над чатом */
.confirm { margin-bottom: 12px; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--grid); background: var(--cell); }
.confirm.alert { border-color: var(--warn); box-shadow: inset 4px 0 0 var(--warn); }
.confirmhead { display: flex; gap: 8px; align-items: baseline; font-size: 13px; }
.confirmhead .ttl { font-weight: 600; }
.confirmhead .st { color: var(--mute); }
.confirm .empty { padding: 2px 0 0; font-size: 13px; }
.confirm .cwhat { margin-top: 6px; color: var(--warn); font-size: 13px; font-weight: 600; }
.cprompt { margin: 6px 0 8px; white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--mono); font-size: 13px;
  line-height: 1.45; color: var(--ink); max-height: 40vh; overflow: auto; }
.cprompt.short { max-height: 4.4em; overflow: hidden; margin: 4px 0 0; color: var(--ink2); font-size: 12px; }
.copts { display: flex; flex-wrap: wrap; gap: 8px; }
.copts .btn { text-align: left; }
.copts .ckey { display: inline-block; min-width: 1.4em; font-family: var(--mono); font-weight: 700; opacity: .75; }
@media (max-width: 720px) { .copts { flex-direction: column; } .copts .btn { min-height: 44px; width: 100%; } }


.tm .btn.small, .tm .btn.ghost { font-size: .8125rem; padding: .3rem .7rem; }
.tm .btn.ghost { background: none; color: var(--ink2); border: 1px solid var(--grid); }
.tm .empty { color: var(--mute); padding: .5rem 0; }
.tm .err { color: var(--bad); min-height: 1.2em; }
.tm .mute.small, .tm .small { font-size: .8125rem; }
.tm-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: .75rem; }
.tm-pick select { font: inherit; padding: .3rem .5rem; margin-left: .4rem; background: var(--cell); color: var(--ink); border: 1px solid var(--grid); max-width: 70vw; }
.tm-wait { font: inherit; color: #fff; background: var(--warn); padding: .2rem .6rem; cursor: pointer; font-weight: 600; }
.tm .toast { position: fixed; left: 50%; bottom: 1.25rem; transform: translateX(-50%); background: var(--ink); color: var(--bg); padding: .6rem 1rem; max-width: 90vw; z-index: 60; }
.tm .fsend { position: fixed; inset: 0; z-index: 50; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; padding: 1rem; }
.tm .fsend[hidden] { display: none; }
.tm .fsend-box { background: var(--cell); border: var(--bw) solid var(--line); padding: 1.25rem; width: min(32rem, 100%); max-height: 85vh; overflow: auto; }
.tm .fsend-img { max-width: 100%; max-height: 40vh; display: block; margin: .5rem 0; }
.tm .fsend-txt { max-height: 30vh; overflow: auto; font: .8125rem var(--mono); background: var(--bg); padding: .5rem; }
@media (max-width: 45rem) {
  main:has(> #v-module:not([hidden]) > .tm:not([hidden])) { display: flex; flex-direction: column; overflow: hidden; }
  main:has(> #v-module:not([hidden]) > .tm:not([hidden])) > #v-module { flex: 1; min-height: 0; display: flex; flex-direction: column; }
  .tm:not([hidden]) { flex: 1; min-height: 0; display: flex; flex-direction: column; }
  .tm #p-term { flex: 1; min-height: 0; display: flex; flex-direction: column; }
  .tm #p-term > .confirm { flex: none; max-height: 35%; overflow: auto; }
  .tm #p-term > .chat { flex: 1 1 auto; min-height: 18rem; height: auto !important; resize: none; }
  .tm #p-term > .termrow { flex: none; }
}

/* кнопка терминала: значок «>_» (+ подпись на десктопе); на телефоне только значок — лимиты в строку целиком */
.termtoggle .tt-ico { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 600; }
.termtoggle .tt-txt { margin-left: .4em; }
@media (max-width: 720px) {
  .termtoggle .tt-txt { display: none; }
  .termrow { flex-wrap: nowrap; gap: 8px; }
  .termrow .termtoggle { flex: none; min-width: 40px; min-height: 36px; padding: 0 8px; }
  .termrow #usage-meter { margin-left: 0; flex: 1; min-width: 0; }
}