/* ===== cc-custom: доработка внешнего вида панели (версия 4) =====
   Файл подключается в dist/index.html как /cc-custom.css.
   Чтобы откатить — удалите строку <link id="cc-custom"> из index.html. */

/* --- 1. Меню: убрать «Report Issue» и «Join Community» (обе версии: список и значки) --- */
a[target="_blank"][href*="github.com"],
a[target="_blank"][href*="discord"] {
  display: none !important;
}

/* --- 2. Поле ввода: убрать длинную серую подсказку «Enter to send • Shift+Enter…» --- */
.text-xs.transition-opacity.duration-200.lg\:block {
  display: none !important;
}

/* --- 3. Поле ввода: крупнее, скругление и мягкая тень, как у claude.ai --- */
form:has([data-slot="prompt-input-textarea"]) {
  border-radius: 20px !important;
  box-shadow: 0 1px 2px rgb(0 0 0 / .04), 0 4px 18px rgb(0 0 0 / .06) !important;
  border-color: rgb(0 0 0 / .08) !important;
}
.dark form:has([data-slot="prompt-input-textarea"]) {
  box-shadow: 0 4px 18px rgb(0 0 0 / .35) !important;
  border-color: rgb(255 255 255 / .08) !important;
}
[data-slot="prompt-input-textarea"] {
  font-size: 16px !important;
  line-height: 1.6 !important;
  padding-top: 12px !important;
}

/* --- 4. Текст ответов Claude: крупнее и свободнее --- */
.chat-message.assistant,
.chat-message.assistant .prose {
  font-size: 16.5px !important;
  line-height: 1.7 !important;
}
.chat-message.assistant .prose p,
.chat-message.assistant .prose li {
  margin-top: .45em !important;
  margin-bottom: .45em !important;
}

/* --- 5. Сообщение пользователя: без аватара «U», мягкий пузырь, крупнее текст --- */
.chat-message.user [class*="rounded-full"] {
  display: none !important;
}
.chat-message.user .rounded-br-md {
  border-radius: 18px !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  padding: 10px 16px !important;
}

/* --- 6. Технические блоки команд ($ ls ...) — тише, чтобы не отвлекали --- */
.chat-message.assistant pre,
.chat-message.assistant code {
  font-size: 12.5px !important;
}

/* --- 7. Боковое меню: чуть крупнее текст --- */
aside, nav {
  font-size: 14.5px;
}

/* ===================== версия 2 ===================== */

/* --- 8. Время и «TXT/копировать» в ваших сообщениях: только при наведении --- */
.chat-message.user .rounded-br-md .text-xs {
  opacity: 0 !important;
  transition: opacity .15s ease;
}
.chat-message.user .rounded-br-md:hover .text-xs {
  opacity: .7 !important;
}

/* --- 9. Таблицы в ответах: скругление, без пустой шапки, аккуратные строки --- */
.chat-message.assistant table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid rgb(0 0 0 / .08) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  font-size: 15px !important;
}
.dark .chat-message.assistant table { border-color: rgb(255 255 255 / .1) !important; }
.chat-message.assistant thead:not(:has(th:not(:empty))) { display: none !important; }
.chat-message.assistant th,
.chat-message.assistant td {
  border: none !important;
  border-bottom: 1px solid rgb(0 0 0 / .06) !important;
  padding: 9px 14px !important;
}
.dark .chat-message.assistant th,
.dark .chat-message.assistant td { border-bottom-color: rgb(255 255 255 / .07) !important; }
.chat-message.assistant tr:last-child td { border-bottom: none !important; }
.chat-message.assistant td:first-child { background: rgb(0 0 0 / .025) !important; color: rgb(0 0 0 / .65); }
.dark .chat-message.assistant td:first-child { background: rgb(255 255 255 / .03) !important; color: rgb(255 255 255 / .7); }

/* --- 10. Блоки команд ($ curl ...): тише, ярче при наведении или когда раскрыт --- */
.group\/cmd {
  opacity: .55;
  box-shadow: none !important;
  transition: opacity .15s ease;
}
.group\/cmd:hover,
.group\/cmd:has([aria-expanded="true"]) {
  opacity: 1;
}
.group\/cmd code,
.group\/cmd pre {
  font-size: 12px !important;
}

/* --- 11. Кнопка «Новый сеанс»: спокойная, в стиле claude.ai --- */
button.w-full.bg-primary {
  background: transparent !important;
  color: hsl(var(--primary)) !important;
  border: 1px solid hsl(var(--primary) / .35) !important;
  box-shadow: none !important;
  font-weight: 500 !important;
}
button.w-full.bg-primary:hover {
  background: hsl(var(--primary) / .08) !important;
}
button.w-full.bg-primary svg { color: hsl(var(--primary)) !important; }

/* --- 12. Строка под полем ввода (режим, Effort, токены): приглушить, ярче при наведении --- */
[data-slot="prompt-input-footer"] {
  border-top-color: transparent !important;
}
[data-slot="prompt-input-footer"] > :first-child {
  opacity: .55;
  transition: opacity .15s ease;
}
form:has([data-slot="prompt-input-textarea"]):hover [data-slot="prompt-input-footer"] > :first-child,
form:has([data-slot="prompt-input-textarea"]):focus-within [data-slot="prompt-input-footer"] > :first-child {
  opacity: 1;
}

/* ===================== версия 3 ===================== */

/* --- 13. Пузырь вашего сообщения: без пустого места снизу.
   Строка времени вынесена под пузырь и видна только при наведении. --- */
.chat-message.user .rounded-br-md { position: relative !important; }
.chat-message.user .rounded-br-md .text-xs {
  position: absolute !important;
  right: 10px;
  bottom: -20px;
  margin: 0 !important;
  white-space: nowrap;
}
.chat-message.user { margin-bottom: 6px; }