/*
 * panel-tweaks.css — мелкие правки вёрстки панели CloudCLI, которые нельзя внести в её код
 * (бандл минифицирован и заменяется при каждом `npm i -g`).
 *
 * Цепляемся за `data-slot`-атрибуты панели (`prompt-input`, `prompt-input-footer`,
 * `prompt-input-tools`): они осмысленные и переживают пересборку, в отличие от
 * минифицированных классов вроде `.py-\[5px\]`.
 *
 * Ставится тем же install.sh, что и виджет лимитов, и так же возвращается сторожем
 * после обновления панели.
 *
 * Создан 05.08.2026 (Claude-NL).
 */

/* ═══ 1. Подсказка о горячих клавишах наезжала на счётчик токенов ══════════════
 *
 * Строка под полем — flex с `justify-between`: слева инструменты (`prompt-input-tools`,
 * у них `min-w-0`), справа подсказка + выбор модели + отправка (`shrink-0`). Когда места
 * не хватает, левая группа не сжимается — её кнопки фиксированной ширины вылезают за свою
 * коробку и оказываются ПОД подсказкой. Отсюда каша из «387K tokens» и «Shift+Enter…».
 *
 * ⚠️ Мерить надо ширину САМОГО ПОЛЯ, а не окна. Панель показывает подсказку от 1024 px
 * ширины окна (`lg:block`), но колонка чата ограничена 54.25rem (868 px) — на мониторе
 * 2000 px окно широкое, а поле узкое, и подсказка налезает всё равно. Первая версия правки
 * опиралась на `@media` по окну и на широком экране не сработала.
 */

/* Опора для расчёта — ширина поля ввода */
[data-slot="prompt-input"] {
  container-type: inline-size;
}

/* Тесно — подсказку убираем совсем. Потеря невелика: «/ для команд» и так написано
   в подсказке самого поля ввода. Порог двигается одной цифрой. */
@container (max-width: 52rem) {
  [data-slot="prompt-input-footer"] div[class*="text-muted-foreground/50"] {
    display: none !important;
  }
}

/* Структурная страховка — работает и там, где @container не поддержан:
   левая группа больше не сжимается (значит, не вылезает за коробку),
   а жертвуем при нехватке места только подсказкой — она обрежется многоточием. */
[data-slot="prompt-input-footer"] > [data-slot="prompt-input-tools"] {
  flex-shrink: 0;
}
[data-slot="prompt-input-footer"] > :last-child {
  min-width: 0;
  flex-shrink: 1;
}
[data-slot="prompt-input-footer"] > :last-child > * {
  flex-shrink: 0;   /* выбор модели и кнопку отправки не трогаем */
}
[data-slot="prompt-input-footer"] div[class*="text-muted-foreground/50"] {
  min-width: 0;
  flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ═══ 2. Колонка чата не использует широкий экран ══════════════════════════════
 *
 * И переписка, и поле ввода ограничены `max-w-[54.25rem]` (868 px) и центрируются.
 * На мониторе это половина пустоты по бокам, а поле при этом остаётся тесным —
 * из-за чего и налезала подсказка из пункта 1.
 *
 * Даём колонке дышать до 68rem (1088 px), но не шире окна. Совсем без потолка делать
 * не стоит: строка в 2000 px нечитаема.
 *
 * ЭТО ДЕЛО ВКУСА — крутится одной цифрой ниже. Вернуть как было: 54.25rem.
 */
[class*="max-w-[54.25rem]"] {
  max-width: min(68rem, 100%) !important;
}