jodit-pro 4.11.19 → 4.11.23

package/es2015/plugins/ai-assistant-pro/ai-assistant-pro.css

@@ -1,7 +1,7 @@
 /*!
  * jodit-pro - PRO Version of Jodit Editor
  * Author: Chupurnov Valerii <chupurnov@gmail.com>
- * Version: v4.11.19
+ * Version: v4.11.23
  * Url: https://xdsoft.net/jodit/pro/
  * License(s): SEE LICENSE IN LICENSE.md
  */
@@ -65,17 +65,17 @@
  */
 /**
  * AI Assistant Pro Design System
- * Централизованная система дизайна с поддержкой темной темы
+ * Centralized design system with dark theme support
  */
 :root,
 .jodit-ai-assistant-pro {
-  --jd-ai-primary-start: #667eea;
-  --jd-ai-primary-end: #764ba2;
+  --jd-ai-primary-start: #636366;
+  --jd-ai-primary-end: #48484a;
   --jd-ai-primary-gradient: linear-gradient(135deg, var(--jd-ai-primary-start) 0%, var(--jd-ai-primary-end) 100%);
-  --jd-ai-accent: #667eea;
-  --jd-ai-accent-hover: #764ba2;
-  --jd-ai-accent-pink-start: #f093fb;
-  --jd-ai-accent-pink-end: #f5576c;
+  --jd-ai-accent: #636366;
+  --jd-ai-accent-hover: #48484a;
+  --jd-ai-accent-pink-start: #8e8e93;
+  --jd-ai-accent-pink-end: #636366;
   --jd-ai-accent-gradient: linear-gradient(135deg, var(--jd-ai-accent-pink-start) 0%, var(--jd-ai-accent-pink-end) 100%);
   --jd-ai-success: #34c759;
   --jd-ai-warning: #ff9500;
@@ -88,33 +88,33 @@
   --jd-ai-text-white-secondary: rgba(255, 255, 255, 0.85);
   --jd-ai-text-white-tertiary: rgba(255, 255, 255, 0.6);
   --jd-ai-bg-primary: #fff;
-  --jd-ai-bg-secondary: #f5f7fa;
-  --jd-ai-bg-tertiary: #f8f9fa;
-  --jd-ai-bg-elevated: rgba(102, 126, 234, 0.08);
-  --jd-ai-bg-hover: rgba(102, 126, 234, 0.05);
+  --jd-ai-bg-secondary: #f5f5f7;
+  --jd-ai-bg-tertiary: #f8f8fa;
+  --jd-ai-bg-elevated: rgba(0, 0, 0, 0.04);
+  --jd-ai-bg-hover: rgba(0, 0, 0, 0.03);
   --jd-ai-bg-danger: rgba(255, 59, 48, 0.05);
   --jd-ai-bg-danger-hover: rgba(255, 59, 48, 0.15);
-  --jd-ai-message-user-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  --jd-ai-message-assistant-gradient: linear-gradient(135deg, #f5f7fa 0%, #fff 100%);
+  --jd-ai-message-user-gradient: linear-gradient(135deg, #6e6e73 0%, #58585a 100%);
+  --jd-ai-message-assistant-gradient: linear-gradient(135deg, #f5f5f7 0%, #fff 100%);
   --jd-ai-message-user-text: var(--jd-ai-text-white);
   --jd-ai-message-assistant-text: var(--jd-ai-text-primary);
   --jd-ai-border-light: rgba(0, 0, 0, 0.06);
   --jd-ai-border-medium: rgba(0, 0, 0, 0.1);
   --jd-ai-border-dark: rgba(0, 0, 0, 0.15);
-  --jd-ai-border-primary: rgba(102, 126, 234, 0.3);
+  --jd-ai-border-primary: rgba(0, 0, 0, 0.12);
   --jd-ai-border-danger: rgba(255, 59, 48, 0.2);
   --jd-ai-text-danger: #ff3b30;
   --jd-ai-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.05);
   --jd-ai-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
   --jd-ai-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
   --jd-ai-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.15);
-  --jd-ai-shadow-primary-sm: 0 2px 8px rgba(102, 126, 234, 0.25);
-  --jd-ai-shadow-primary-md: 0 4px 15px rgba(102, 126, 234, 0.3);
-  --jd-ai-shadow-primary-lg: 0 6px 20px rgba(102, 126, 234, 0.4);
-  --jd-ai-shadow-accent-sm: 0 2px 10px rgba(245, 87, 108, 0.25);
-  --jd-ai-shadow-accent-md: 0 4px 15px rgba(245, 87, 108, 0.3);
-  --jd-ai-shadow-accent-lg: 0 6px 20px rgba(245, 87, 108, 0.4);
-  --jd-ai-shadow-primary-focus: rgba(102, 126, 234, 0.08);
+  --jd-ai-shadow-primary-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
+  --jd-ai-shadow-primary-md: 0 4px 15px rgba(0, 0, 0, 0.12);
+  --jd-ai-shadow-primary-lg: 0 6px 20px rgba(0, 0, 0, 0.15);
+  --jd-ai-shadow-accent-sm: 0 2px 10px rgba(0, 0, 0, 0.1);
+  --jd-ai-shadow-accent-md: 0 4px 15px rgba(0, 0, 0, 0.12);
+  --jd-ai-shadow-accent-lg: 0 6px 20px rgba(0, 0, 0, 0.15);
+  --jd-ai-shadow-primary-focus: rgba(0, 0, 0, 0.06);
   --jd-ai-overlay-light: rgba(255, 255, 255, 0.15);
   --jd-ai-overlay-medium: rgba(255, 255, 255, 0.25);
   --jd-ai-overlay-dark: rgba(0, 0, 0, 0.05);
@@ -153,8 +153,8 @@
   --jd-ai-z-modal: 100;
   --jd-ai-header-height: 60px;
   --jd-ai-input-height: 44px;
-  --jd-ai-button-size: 40px;
-  --jd-ai-button-sm-size: 32px;
+  --jd-ai-button-size: 32px;
+  --jd-ai-button-sm-size: 28px;
   --jd-ai-avatar-size: 36px;
   --jd-ai-tool-min-height: 56px;
 }
@@ -168,12 +168,12 @@
 .jodit_theme_dark:not(:has(.jodit_theme_light)),
 .jodit-ai-assistant-pro_theme_dark:not( :has(.jodit-ai-assistant-pro_theme_light)) {
   --jd-color-background-default: var(--jd-dark-background-color);
-  --jd-ai-primary-start: #7c93ff;
-  --jd-ai-primary-end: #8b5fc7;
-  --jd-ai-accent: #7c93ff;
-  --jd-ai-accent-hover: #8b5fc7;
-  --jd-ai-accent-pink-start: #ff9ff3;
-  --jd-ai-accent-pink-end: #ff6b7a;
+  --jd-ai-primary-start: #98989d;
+  --jd-ai-primary-end: #8e8e93;
+  --jd-ai-accent: #98989d;
+  --jd-ai-accent-hover: #c7c7cc;
+  --jd-ai-accent-pink-start: #8e8e93;
+  --jd-ai-accent-pink-end: #98989d;
   --jd-ai-text-primary: #fff;
   --jd-ai-text-secondary: #e5e5e7;
   --jd-ai-text-tertiary: #98989d;
@@ -183,31 +183,31 @@
   --jd-ai-bg-primary: #2b2b2b;
   --jd-ai-bg-secondary: #2c2c2e;
   --jd-ai-bg-tertiary: #3a3a3c;
-  --jd-ai-bg-elevated: rgba(124, 147, 255, 0.12);
-  --jd-ai-bg-hover: rgba(124, 147, 255, 0.08);
+  --jd-ai-bg-elevated: rgba(255, 255, 255, 0.08);
+  --jd-ai-bg-hover: rgba(255, 255, 255, 0.05);
   --jd-ai-bg-danger: rgba(255, 59, 48, 0.15);
   --jd-ai-bg-danger-hover: rgba(255, 59, 48, 0.25);
-  --jd-ai-message-user-gradient: linear-gradient(135deg, #7c93ff 0%, #8b5fc7 100%);
+  --jd-ai-message-user-gradient: linear-gradient(135deg, #58585a 0%, #48484a 100%);
   --jd-ai-message-assistant-gradient: linear-gradient(135deg, #3a3a3c 0%, #48484a 100%);
   --jd-ai-message-user-text: var(--jd-ai-text-white);
   --jd-ai-message-assistant-text: var(--jd-ai-text-white);
   --jd-ai-border-light: rgba(255, 255, 255, 0.1);
   --jd-ai-border-medium: rgba(255, 255, 255, 0.15);
   --jd-ai-border-dark: rgba(255, 255, 255, 0.2);
-  --jd-ai-border-primary: rgba(124, 147, 255, 0.4);
+  --jd-ai-border-primary: rgba(255, 255, 255, 0.15);
   --jd-ai-border-danger: rgba(255, 59, 48, 0.3);
   --jd-ai-text-danger: #ff6b6b;
-  --jd-ai-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
-  --jd-ai-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
-  --jd-ai-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
-  --jd-ai-shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.6);
-  --jd-ai-shadow-primary-sm: 0 2px 8px rgba(124, 147, 255, 0.3);
-  --jd-ai-shadow-primary-md: 0 4px 15px rgba(124, 147, 255, 0.35);
-  --jd-ai-shadow-primary-lg: 0 6px 20px rgba(124, 147, 255, 0.4);
-  --jd-ai-shadow-accent-sm: 0 2px 10px rgba(255, 107, 122, 0.3);
-  --jd-ai-shadow-accent-md: 0 4px 15px rgba(255, 107, 122, 0.35);
-  --jd-ai-shadow-accent-lg: 0 6px 20px rgba(255, 107, 122, 0.4);
-  --jd-ai-shadow-primary-focus: rgba(124, 147, 255, 0.12);
+  --jd-ai-shadow-sm: none;
+  --jd-ai-shadow-md: none;
+  --jd-ai-shadow-lg: none;
+  --jd-ai-shadow-xl: none;
+  --jd-ai-shadow-primary-sm: none;
+  --jd-ai-shadow-primary-md: none;
+  --jd-ai-shadow-primary-lg: none;
+  --jd-ai-shadow-accent-sm: none;
+  --jd-ai-shadow-accent-md: none;
+  --jd-ai-shadow-accent-lg: none;
+  --jd-ai-shadow-primary-focus: rgba(255, 255, 255, 0.05);
   --jd-ai-overlay-light: rgba(255, 255, 255, 0.1);
   --jd-ai-overlay-medium: rgba(255, 255, 255, 0.15);
   --jd-ai-overlay-dark: rgba(0, 0, 0, 0.3);
@@ -232,7 +232,7 @@
 .jodit-ai-assistant-pro_theme_dark:not( :has(.jodit-ai-assistant-pro_theme_light)) .jodit-ui-button_variant_default {
   border: 1px solid var(--jd-ai-border-light) !important;
   background: var(--jd-ai-bg-elevated) !important;
-  box-shadow: var(--jd-ai-shadow-sm) !important;
+  box-shadow: none !important;
 }
 .jodit-dialog_theme_dark:not(:has(.jodit-dialog_theme_light)) .jodit-ui-main-panel .jodit-ui-text-area__input,
 .jodit_theme_dark:not(:has(.jodit_theme_light)) .jodit-ui-main-panel .jodit-ui-text-area__input,
@@ -278,21 +278,21 @@
 .jodit-ai-assistant-pro_theme_light .jodit-ui-main-panel,
 .jodit-ai-assistant-pro_theme_light .jodit-ui-settings-popup,
 .jodit-ai-assistant-pro_theme_light {
-  --jd-ai-primary-start: #667eea;
-  --jd-ai-primary-end: #764ba2;
+  --jd-ai-primary-start: #636366;
+  --jd-ai-primary-end: #48484a;
   --jd-ai-text-primary: #1c1c1e;
   --jd-ai-text-secondary: #3a3a3c;
   --jd-ai-text-tertiary: #8e8e93;
   --jd-ai-bg-primary: #fff;
-  --jd-ai-bg-secondary: #f5f7fa;
-  --jd-ai-bg-tertiary: #f8f9fa;
-  --jd-ai-bg-elevated: rgba(102, 126, 234, 0.08);
-  --jd-ai-bg-hover: rgba(102, 126, 234, 0.05);
+  --jd-ai-bg-secondary: #f5f5f7;
+  --jd-ai-bg-tertiary: #f8f8fa;
+  --jd-ai-bg-elevated: rgba(0, 0, 0, 0.04);
+  --jd-ai-bg-hover: rgba(0, 0, 0, 0.03);
   --jd-ai-border-light: rgba(0, 0, 0, 0.06);
   --jd-ai-border-medium: rgba(0, 0, 0, 0.1);
-  --jd-ai-border-primary: rgba(102, 126, 234, 0.3);
-  --jd-ai-message-user-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  --jd-ai-message-assistant-gradient: linear-gradient(135deg, #f5f7fa 0%, #fff 100%);
+  --jd-ai-border-primary: rgba(0, 0, 0, 0.12);
+  --jd-ai-message-user-gradient: linear-gradient(135deg, #6e6e73 0%, #58585a 100%);
+  --jd-ai-message-assistant-gradient: linear-gradient(135deg, #f5f5f7 0%, #fff 100%);
   --jd-ai-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.05);
   --jd-ai-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
   --jd-ai-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
@@ -381,7 +381,6 @@
   justify-content: space-between;
   padding: calc(var(--jd-padding-default) * 1.25) var(--jd-padding-default);
   border-bottom: 1px solid var(--jd-ai-border-light);
-  box-shadow: var(--jd-ai-shadow-md);
   gap: var(--jd-ai-space-md);
   backdrop-filter: blur(20px) saturate(180%);
   background: rgba(255, 255, 255, 0.85);
@@ -403,17 +402,35 @@
   overflow: hidden;
   flex: 1;
   font-size: var(--jd-ai-text-2xl);
-  font-weight: var(--jd-ai-weight-bold);
   letter-spacing: -0.3px;
   text-overflow: ellipsis;
   white-space: nowrap;
-  background: var(--jd-ai-primary-gradient);
-  background-clip: text;
-  -webkit-text-fill-color: transparent;
+  color: var(--jd-ai-text-primary);
+  font-weight: var(--jd-ai-weight-bold);
 }
 .jodit-ui-main-panel_view_conversation .jodit-ui-main-panel__header-left {
   display: flex;
 }
+.jodit-ui-main-panel__conversation-actions-button {
+  display: none;
+}
+.jodit-ui-main-panel_view_conversation .jodit-ui-main-panel__conversation-actions-button {
+  display: flex;
+}
+.jodit-ui-main-panel__header-title-input {
+  width: 100%;
+  padding: 2px 6px;
+  border: 1px solid var(--jd-ai-border-medium);
+  border-radius: var(--jd-ai-radius-sm);
+  background: var(--jd-ai-bg-primary);
+  color: var(--jd-ai-text-primary);
+  font-size: inherit;
+  font-weight: inherit;
+  outline: none;
+}
+.jodit-ui-main-panel__header-title-input:focus {
+  border-color: var(--jd-ai-text-tertiary);
+}
 .jodit-ui-main-panel__content {
   flex: 1;
   background: var(--jd-color-background-default);
@@ -423,7 +440,6 @@
   display: none;
   border-top: 1px solid var(--jd-ai-border-light);
   background: var(--jd-ai-bg-primary);
-  box-shadow: var(--jd-ai-shadow-sm);
 }
 .jodit-ui-main-panel_view_conversation .jodit-ui-main-panel__footer,
 .jodit-ui-main-panel_view_welcome .jodit-ui-main-panel__footer {
@@ -447,12 +463,12 @@
 }
 .jodit-ui-main-panel__new-button button {
   border: none !important;
-  background: var(--jd-ai-primary-gradient) !important;
-  box-shadow: var(--jd-ai-shadow-primary-md) !important;
+  background: var(--jd-ai-primary-start) !important;
+  box-shadow: none !important;
   color: var(--jd-ai-text-white) !important;
 }
 .jodit-ui-main-panel__new-button button:hover {
-  box-shadow: var(--jd-ai-shadow-primary-lg) !important;
+  opacity: 0.8;
 }
 .jodit-ui-main-panel__new-button button svg {
   fill: var(--jd-ai-text-white) !important;
@@ -478,9 +494,8 @@
   height: var(--jd-ai-input-height);
   border: 4px solid var(--jd-ai-border-light);
   border-radius: var(--jd-ai-radius-full);
-  border-top-color: var(--jd-ai-primary-start);
+  border-top-color: var(--jd-ai-text-tertiary);
   animation: ai-spin 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
-  box-shadow: var(--jd-ai-shadow-primary-sm);
 }
 .jodit-plugin__ai-assistant-pro__flight-container .jodit-ui-main-panel {
   border-radius: var(--jd-ai-radius-lg) var(--jd-ai-radius-lg) 0 0;
@@ -571,7 +586,7 @@
   height: var(--jd-ai-space-lg);
   border: 2px solid var(--jd-ai-border-light);
   border-radius: var(--jd-ai-radius-full);
-  border-top-color: var(--jd-ai-primary-start);
+  border-top-color: var(--jd-ai-text-tertiary);
   margin-top: -8px;
   animation: ai-spin 0.6s linear infinite;
 }
@@ -599,12 +614,9 @@
   border-color: var(--jd-ai-border-primary);
   background: var(--jd-ai-bg-hover);
 }
-.jodit-ui-conversation-list__item:hover .jodit-ui-conversation-list__item-delete {
-  opacity: 1;
-}
 .jodit-ui-conversation-list__item_active {
   border-color: var(--jd-ai-border-primary);
-  background: var(--jd-ai-message-assistant-gradient);
+  background: var(--jd-ai-bg-secondary);
 }
 .jodit-ui-conversation-list__item-avatar {
   display: flex;
@@ -613,10 +625,9 @@
   flex-shrink: 0;
   align-items: center;
   justify-content: center;
-  border-radius: var(--jd-ai-radius-full);
+  border-radius: var(--jd-ai-radius-md);
   margin-right: var(--jd-ai-space-md);
-  background: var(--jd-ai-primary-gradient);
-  box-shadow: var(--jd-ai-shadow-primary-sm);
+  background: var(--jd-ai-text-tertiary);
   color: var(--jd-ai-text-white);
   font-size: var(--jd-ai-text-sm);
   font-weight: var(--jd-ai-weight-semibold);
@@ -632,29 +643,15 @@
   min-width: 0;
   flex: 1;
 }
-.jodit-ui-conversation-list__item-delete {
+.jodit-ui-conversation-list__item-actions {
   display: flex;
-  width: var(--jd-ai-button-sm-size);
-  height: var(--jd-ai-button-sm-size);
   flex-shrink: 0;
   align-items: center;
-  justify-content: center;
-  padding: 0;
   margin-left: var(--jd-ai-space-sm);
-  color: var(--jd-ai-text-danger);
-  cursor: pointer;
-  transition: all var(--jd-ai-transition-base);
-}
-.jodit-ui-conversation-list__item-delete:hover {
-  border-color: var(--jd-ai-text-danger);
-  background: var(--jd-ai-bg-danger-hover);
-  transform: scale(1.1);
-}
-.jodit-ui-conversation-list__item-delete:active {
-  transform: scale(0.9);
+  color: var(--jd-ai-text-tertiary);
 }
-.jodit-ui-conversation-list__item-delete .jodit-icon {
-  font-size: var(--jd-ai-text-sm);
+.jodit-ui-conversation-list__item-actions:hover {
+  color: var(--jd-ai-text-primary);
 }
 .jodit-ui-conversation-list__item-title {
   overflow: hidden;
@@ -663,8 +660,22 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.jodit-ui-conversation-list__item-title-input {
+  width: 100%;
+  padding: 2px 6px;
+  border: 1px solid var(--jd-ai-border-medium);
+  border-radius: var(--jd-ai-radius-sm);
+  background: var(--jd-ai-bg-primary);
+  color: var(--jd-ai-text-primary);
+  font-size: inherit;
+  font-weight: inherit;
+  outline: none;
+}
+.jodit-ui-conversation-list__item-title-input:focus {
+  border-color: var(--jd-ai-text-tertiary);
+}
 .jodit-ui-conversation-list__item-meta {
-  color: var(--jd-color-label);
+  color: var(--jd-ai-text-tertiary);
   font-size: var(--jd-font-size-small);
 }
 .jodit-ui-conversation-list__item-badge {
@@ -675,8 +686,8 @@
   justify-content: center;
   padding: 0 6px;
   border-radius: 10px;
-  background: var(--jd-color-background-active);
-  color: var(--jd-color-white);
+  background: var(--jd-ai-text-tertiary);
+  color: var(--jd-ai-text-white);
   font-size: var(--jd-font-size-small);
   font-weight: bold;
 }
@@ -936,7 +947,9 @@
 }
 .jodit-ui-message-list-item__message-bubble {
   position: relative;
+  display: flex;
   max-width: 90%;
+  flex-direction: column;
   padding: var(--jd-ai-space-lg);
   border-radius: var(--jd-ai-radius-xl);
   overflow-wrap: break-word;
@@ -946,23 +959,17 @@
   border: none;
   border-radius: var(--jd-ai-radius-xl) var(--jd-ai-radius-xl) var(--jd-ai-radius-sm) var(--jd-ai-radius-xl);
   background: var(--jd-ai-message-user-gradient);
-  box-shadow: var(--jd-ai-shadow-primary-sm);
+  box-shadow: none;
   color: var(--jd-ai-message-user-text);
 }
-.jodit-ui-message-list-item__message-bubble_user_true:hover {
-  box-shadow: var(--jd-ai-shadow-primary-md);
-}
 .jodit-ui-message-list-item__message-bubble_assistant_true {
   padding: var(--jd-ai-space-lg);
   border: 1px solid var(--jd-ai-border-light);
   border-radius: var(--jd-ai-radius-xl) var(--jd-ai-radius-xl) var(--jd-ai-radius-xl) var(--jd-ai-radius-sm);
   background: var(--jd-ai-message-assistant-gradient);
-  box-shadow: var(--jd-ai-shadow-sm);
+  box-shadow: none;
   color: var(--jd-ai-message-assistant-text);
 }
-.jodit-ui-message-list-item__message-bubble_assistant_true:hover {
-  box-shadow: var(--jd-ai-shadow-md);
-}
 .jodit-ui-message-list-item__message-bubble_tool_true {
   max-width: 80%;
   padding: var(--jd-ai-space-md) var(--jd-ai-space-lg);
@@ -1334,7 +1341,8 @@
   color: var(--jd-ai-text-primary);
 }
 .jodit-ui-message-list-item__message-timestamp {
-  margin-top: var(--jd-ai-space-sm);
+  margin-top: auto;
+  padding-top: var(--jd-ai-space-sm);
   font-size: var(--jd-ai-text-xs);
   font-weight: var(--jd-ai-weight-medium);
   letter-spacing: 0.3px;
@@ -1351,7 +1359,7 @@
   opacity: 1;
 }
 .jodit-ui-message-list-item__message-bubble_user_true .jodit-ui-message-list-item__message-timestamp {
-  color: var(--jd-ai-text-white-secondary);
+  color: var(--jd-ai-text-white-tertiary);
 }
 .jodit-ui-message-list-item__message-bubble_assistant_true .jodit-ui-message-list-item__message-timestamp {
   color: var(--jd-ai-text-tertiary);
@@ -1368,13 +1376,11 @@
   background: var(--jd-ai-bg-secondary);
   border-bottom-right-radius: var(--jd-ai-radius-lg);
   border-top-right-radius: var(--jd-ai-radius-lg);
-  box-shadow: var(--jd-ai-shadow-sm);
+  box-shadow: none;
   gap: 0;
-  transition: all var(--jd-ai-transition-base);
 }
 .jodit-ui-message-list-item__tool-call:hover {
-  border-color: var(--jd-ai-accent);
-  box-shadow: var(--jd-ai-shadow-md);
+  border-color: var(--jd-ai-border-dark);
 }
 .jodit-ui-message-list-item__tool-call + .jodit-ui-message-list-item__tool-call {
   margin-top: var(--jd-ai-space-md);
@@ -1385,42 +1391,42 @@
   flex-direction: row;
   align-items: center;
   padding: var(--jd-ai-space-md) var(--jd-ai-space-lg);
-  background: var(--jd-ai-accent-gradient);
+  border-bottom: 1px solid var(--jd-ai-border-light);
+  background: var(--jd-ai-bg-tertiary);
   border-top-right-radius: var(--jd-ai-radius-lg);
   gap: var(--jd-ai-space-md);
 }
 .jodit-ui-message-list-item__tool-icon {
-  position: relative;
-  z-index: var(--jd-ai-z-elevated);
   display: flex;
-  width: var(--jd-ai-avatar-size);
-  height: var(--jd-ai-avatar-size);
+  width: 24px;
+  height: 24px;
   flex-shrink: 0;
   align-items: center;
   justify-content: center;
-  font-size: var(--jd-ai-text-3xl);
+  color: var(--jd-ai-text-tertiary);
+}
+.jodit-ui-message-list-item__tool-icon svg {
+  width: 16px;
+  height: 16px;
 }
 .jodit-ui-message-list-item__tool-name {
-  position: relative;
-  z-index: var(--jd-ai-z-elevated);
   min-width: 0;
   flex: 1;
-  color: var(--jd-ai-text-white);
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-  font-size: var(--jd-ai-text-lg);
-  font-weight: var(--jd-ai-weight-semibold);
+  color: var(--jd-ai-text-primary);
+  font-family: 'SF Mono', Monaco, Consolas, monospace;
+  font-size: var(--jd-ai-text-sm);
+  font-weight: var(--jd-ai-weight-medium);
   line-height: 1.4;
 }
 .jodit-ui-message-list-item__tool-status {
-  position: relative;
-  z-index: var(--jd-ai-z-elevated);
   flex-shrink: 0;
-  padding: var(--jd-ai-space-sm) var(--jd-ai-space-md);
+  padding: 2px var(--jd-ai-space-sm);
+  border: 1px solid var(--jd-ai-border-light);
   border-radius: var(--jd-ai-radius-sm);
-  background: var(--jd-ai-overlay-medium);
-  color: var(--jd-ai-text-white);
+  background: transparent;
+  color: var(--jd-ai-text-tertiary);
   font-size: var(--jd-ai-text-xs);
-  font-weight: var(--jd-ai-weight-semibold);
+  font-weight: var(--jd-ai-weight-medium);
   letter-spacing: 0.3px;
   text-transform: uppercase;
   white-space: nowrap;
@@ -1483,7 +1489,9 @@
   border-top: 1px solid var(--jd-ai-border-light);
 }
 .jodit-ui-message-list-item__tool-expandable-toggle {
+  display: flex;
   width: 100%;
+  align-items: center;
   padding: var(--jd-ai-space-sm);
   border: none;
   border-radius: var(--jd-ai-radius-sm);
@@ -1492,6 +1500,7 @@
   cursor: pointer;
   font-size: var(--jd-ai-text-sm);
   font-weight: var(--jd-ai-weight-medium);
+  gap: var(--jd-ai-space-sm);
   text-align: left;
   transition: all var(--jd-ai-transition-fast);
 }
@@ -1500,7 +1509,23 @@
   color: var(--jd-ai-text-primary);
 }
 .jodit-ui-message-list-item__tool-expandable-toggle:active {
-  background: var(--jd-ai-bg-active);
+  background: var(--jd-ai-bg-hover);
+}
+.jodit-ui-message-list-item__tool-expandable-chevron {
+  display: flex;
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  transition: transform var(--jd-ai-transition-fast);
+}
+.jodit-ui-message-list-item__tool-expandable-chevron svg {
+  width: 12px;
+  height: 12px;
+}
+.expanded > .jodit-ui-message-list-item__tool-expandable-chevron {
+  transform: rotate(90deg);
 }
 .jodit-ui-message-list-item__tool-expandable-content {
   max-height: 300px;
@@ -1537,62 +1562,110 @@
   border-top-right-radius: 0;
 }
 /**
- * Permission Request styles
+ * Permission Request styles — flat monochrome design
  */
 .jodit-ui-permission-request__container {
-  padding: calc(var(--jd-padding-default) * 1.5);
-  border: 1px solid var(--jd-ai-text-primary);
-  border-radius: calc(var(--jd-border-radius-default) * 1.5);
-  margin: var(--jd-padding-default);
-  background: var(--jd-color-panel);
+  overflow: hidden;
+  padding: var(--jd-ai-space-md);
+  border: 1px solid var(--jd-ai-border-medium);
+  border-radius: var(--jd-ai-radius-lg);
+  margin: var(--jd-ai-space-md);
+  background: var(--jd-ai-bg-secondary);
 }
 .jodit-ui-permission-request__header {
   display: flex;
   align-items: center;
-  margin-bottom: calc(var(--jd-padding-default) / 2);
-  gap: calc(var(--jd-padding-default) / 2);
+  margin-bottom: var(--jd-ai-space-md);
+  gap: var(--jd-ai-space-sm);
 }
 .jodit-ui-permission-request__icon {
   display: flex;
-  width: 24px;
-  height: 24px;
+  width: 20px;
+  height: 20px;
+  flex-shrink: 0;
   align-items: center;
   justify-content: center;
-  border: 2px solid var(--jd-ai-text-primary);
-  border-radius: 50%;
-  color: var(--jd-ai-text-primary);
-  font-weight: bold;
+  color: var(--jd-ai-text-secondary);
 }
-.jodit-ui-permission-request__icon::before {
-  content: '!';
+.jodit-ui-permission-request__icon svg {
+  width: 18px;
+  height: 18px;
 }
 .jodit-ui-permission-request__title {
   color: var(--jd-ai-text-primary);
-  font-weight: bold;
+  font-size: var(--jd-ai-text-sm);
+  font-weight: var(--jd-ai-weight-semibold);
+  letter-spacing: 0.2px;
 }
 .jodit-ui-permission-request__tool-info {
-  margin-bottom: var(--jd-padding-default);
+  overflow: hidden;
+  padding: var(--jd-ai-space-sm) var(--jd-ai-space-md);
+  border-radius: var(--jd-ai-radius-sm);
+  background: var(--jd-ai-bg-tertiary);
 }
 .jodit-ui-permission-request__tool-name {
-  margin-bottom: 4px;
-  font-family: monospace;
-  font-weight: bold;
+  margin-bottom: 2px;
+  color: var(--jd-ai-text-primary);
+  font-family: 'SF Mono', Monaco, Consolas, monospace;
+  font-size: var(--jd-ai-text-sm);
+  font-weight: var(--jd-ai-weight-medium);
 }
 .jodit-ui-permission-request__tool-args {
   overflow: auto;
-  max-height: 40px;
-  color: var(--jd-color-label);
-  font-family: monospace;
-  font-size: var(--jd-font-size-small);
+  max-height: 60px;
+  color: var(--jd-ai-text-tertiary);
+  font-family: 'SF Mono', Monaco, Consolas, monospace;
+  font-size: var(--jd-ai-text-xs);
+  line-height: 1.4;
+  overflow-wrap: anywhere;
 }
 .jodit-ui-permission-request__actions {
   display: flex;
-  align-items: center;
-  gap: calc(var(--jd-padding-default) / 2);
+  flex-direction: column;
+  padding-top: var(--jd-ai-space-md);
+  border-top: 1px solid var(--jd-ai-border-medium);
+  margin-top: 0;
+  gap: var(--jd-ai-space-md);
 }
-.jodit-ui-permission-request__actions .jodit-ui-select {
+.jodit-ui-permission-request__actions-buttons {
+  display: flex;
+  gap: var(--jd-ai-space-sm);
+}
+.jodit-ui-permission-request__actions-buttons .jodit-ui-button {
+  flex: 1;
+}
+.jodit-ui-permission-request__actions-scope .jodit-ui-select {
   margin-bottom: 0;
 }
+.jodit-ui-permission-request .jodit-ui-button[data-ref='deny-permission'] {
+  padding: 4px var(--jd-ai-space-md) !important;
+  border: 1px solid var(--jd-ai-border-medium) !important;
+  border-radius: var(--jd-ai-radius-sm) !important;
+  background: transparent !important;
+  box-shadow: none !important;
+  color: var(--jd-ai-text-secondary) !important;
+  font-size: var(--jd-ai-text-xs) !important;
+}
+.jodit-ui-permission-request .jodit-ui-button[data-ref='deny-permission']:hover {
+  border-color: var(--jd-ai-text-tertiary) !important;
+  background: var(--jd-ai-bg-hover) !important;
+  color: var(--jd-ai-text-primary) !important;
+}
+.jodit-ui-permission-request .jodit-ui-button[data-ref='approve-permission'] {
+  padding: 4px var(--jd-ai-space-md) !important;
+  border: 1px solid var(--jd-ai-text-secondary) !important;
+  border-radius: var(--jd-ai-radius-sm) !important;
+  background: var(--jd-ai-text-secondary) !important;
+  box-shadow: none !important;
+  color: var(--jd-ai-text-white) !important;
+  font-size: var(--jd-ai-text-xs) !important;
+}
+.jodit-ui-permission-request .jodit-ui-button[data-ref='approve-permission']:hover {
+  background: var(--jd-ai-text-tertiary) !important;
+}
+.jodit-ui-permission-request .jodit-ui-button[data-ref='approve-permission']:active {
+  background: var(--jd-ai-text-primary) !important;
+}
 /**
  * Input Area styles
  */
@@ -1676,9 +1749,9 @@
   transition: all var(--jd-ai-transition-base);
 }
 .jodit-ui-input-area__input-row:focus-within {
-  border-color: var(--jd-ai-border-primary);
+  border-color: var(--jd-ai-border-medium);
   background: var(--jd-ai-bg-primary);
-  box-shadow: 0 0 0 3px var(--jd-ai-shadow-primary-focus);
+  box-shadow: 0 0 0 2px var(--jd-ai-shadow-primary-focus);
 }
 .jodit-ui-input-area__textarea-wrapper {
   flex: 1;
@@ -1715,22 +1788,20 @@
   align-items: center;
   justify-content: center;
   padding: 0;
-  border: none;
-  border-radius: var(--jd-ai-radius-full);
-  background: var(--jd-ai-primary-gradient);
-  box-shadow: var(--jd-ai-shadow-primary-md);
-  color: var(--jd-ai-text-white);
-  transition: all var(--jd-ai-transition-base);
+  border: none !important;
+  border-radius: var(--jd-ai-radius-sm) !important;
+  background: var(--jd-ai-text-secondary) !important;
+  box-shadow: none !important;
+  color: var(--jd-ai-text-white) !important;
 }
 .jodit-ui-input-area__buttons button:hover {
-  box-shadow: var(--jd-ai-shadow-primary-lg);
-  transform: scale(1.1);
+  background: var(--jd-ai-text-tertiary) !important;
 }
 .jodit-ui-input-area__buttons button:active {
-  transform: scale(0.95);
+  background: var(--jd-ai-text-primary) !important;
 }
 .jodit-ui-input-area__buttons button svg {
-  fill: var(--jd-ai-text-white);
+  fill: var(--jd-ai-text-white) !important;
 }
 @keyframes loading-pulse {
   0%,