/* Assistant V2 – Clean rebuilt UI (replaces enhanced_assistant.css)
   Goals: stable layout, accessible structure, theming via CSS vars, minimal specificity, no dynamic DOM rebuild */

:root {
  --assistant-width: 400px;
  --assistant-height: 600px;
  --assistant-radius: 16px;
  --assistant-bg: #ffffff;
  --assistant-border: #e5e7eb;
  --assistant-shadow: 0 20px 40px rgba(0,0,0,0.15);
  --assistant-font: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --assistant-accent-start: #0066cc;
  --assistant-accent-end: #173f88;
  --assistant-accent: linear-gradient(135deg,var(--assistant-accent-start),var(--assistant-accent-end));
  --assistant-text: #374151;
  --assistant-muted: #6b7280;
  --assistant-border-radius-sm: 8px;
}

/* Container */
#ai-assistant-v2 {
  position: fixed;
  inset: auto 20px 20px auto;
  width: var(--assistant-width);
  max-width: calc(100vw - 40px);
  height: var(--assistant-height);
  max-height: calc(100vh - 40px);
  background: var(--assistant-bg);
  border: 1px solid var(--assistant-border);
  border-radius: var(--assistant-radius);
  display: flex;
  flex-direction: column;
  font-family: var(--assistant-font);
  box-shadow: var(--assistant-shadow);
  z-index: 1055;
  overflow: hidden;
  transition: height .3s, width .3s;
}

#ai-assistant-v2.minimized {height: 60px; width: 280px;}
#ai-assistant-v2.minimized .assistant-body, #ai-assistant-v2.minimized .assistant-footer {display:none;}

/* Header */
#ai-assistant-v2 .assistant-header {display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--assistant-accent);color:#fff;min-height:60px;}
#ai-assistant-v2 .assistant-header .left {display:flex;align-items:center;gap:10px;overflow:none;}
#ai-assistant-v2 .assistant-header .right {display:flex;align-items:center;gap:6px;}
#ai-assistant-v2 .status-dot {width:10px;height:10px;border-radius:50%;background:#f59e0b;box-shadow:0 0 0 3px rgba(255,255,255,.25);} 
#ai-assistant-v2.connected .status-dot {background:#10b981;}
#ai-assistant-v2.error .status-dot {background:#ef4444;}
#ai-assistant-v2 .context-label {font-size:12px;opacity:.85;white-space:nowrap;text-overflow:ellipsis;max-width:130px;overflow:hidden;}
#ai-assistant-v2 button.icon {background:rgba(255,255,255,.2);border:none;color:#fff;width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s;}
#ai-assistant-v2 button.icon:hover {background:rgba(255,255,255,.3);} 

/* Body */
#ai-assistant-v2 .assistant-body {flex:1;display:flex;flex-direction:column;overflow:hidden;}
#ai-assistant-v2 .messages {flex:1;padding:16px;overflow-y:auto;scroll-behavior:smooth;background:#fafbfc;}
#ai-assistant-v2 .messages::-webkit-scrollbar{width:6px;} 
#ai-assistant-v2 .messages::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px;}

/* Message */
.ai-msg,.user-msg,.sys-msg {display:flex;margin-bottom:14px;gap:10px;animation:fadeIn .25s ease;}
.user-msg {flex-direction:row-reverse;}
@keyframes fadeIn {from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.msg-avatar {width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#10b981,#059669);color:#fff;flex-shrink:0;font-size:16px;}
.user-msg .msg-avatar {background:linear-gradient(135deg,#3b82f6,#1d4ed8);} 
.sys-msg .msg-avatar {background:linear-gradient(135deg,#ef4444,#dc2626);} 
.msg-bubble {background:#fff;border:1px solid #e5e7eb;padding:10px 14px;border-radius:14px;line-height:1.45;font-size:14px;color:var(--assistant-text);max-width:calc(100% - 54px);position:relative;}
.user-msg .msg-bubble {background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;}
.msg-meta {margin-top:4px;font-size:11px;opacity:.6;display:flex;gap:6px;}

/* Retry button styling */
.retry-container {margin-top:8px;}
.retry-btn {background:#fff;border:1px solid #f59e0b;color:#b45309;padding:4px 10px;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s,border-color .2s,color .2s;}
.retry-btn:hover {background:#fef3c7;border-color:#d97706;color:#92400e;}
.retry-btn:disabled {opacity:.6;cursor:default;}

@media (prefers-color-scheme: dark){
  .retry-btn {background:#374151;border-color:#d97706;color:#fbbf24;}
  .retry-btn:hover {background:#4b5563;}
}

/* Typing indicator */
.typing {display:flex;align-items:center;gap:8px;padding:0 16px 12px;color:var(--assistant-muted);font-size:13px;}
.typing .dots {display:flex;gap:4px;}
.typing .dots span {width:7px;height:7px;border-radius:50%;background:#9ca3af;animation:dot 1s infinite ease-in-out;}
.typing .dots span:nth-child(2){animation-delay:.2s;}
.typing .dots span:nth-child(3){animation-delay:.4s;}
@keyframes dot {0%,80%,100%{transform:scale(1);opacity:.6;}40%{transform:scale(1.4);opacity:1;}}

/* Footer */
#ai-assistant-v2 .assistant-footer {border-top:1px solid var(--assistant-border);background:#fff;padding:10px 12px;display:flex;flex-direction:column;gap:6px;}
#ai-assistant-v2 .input-row {display:flex;align-items:flex-end;gap:8px;}
#ai-assistant-v2 textarea {flex:1;border:1px solid var(--assistant-border);border-radius:12px;padding:8px 12px;resize:none;max-height:140px;min-height:38px;font:inherit;line-height:1.4;outline:none;transition:border-color .2s,box-shadow .2s;background:#fff;}
#ai-assistant-v2 textarea:focus {border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.15);} 
#ai-assistant-v2 button.send {background:linear-gradient(135deg,#3b82f6,#1d4ed8);border:none;color:#fff;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;transition:transform .2s,box-shadow .2s;flex-shrink:0;}
#ai-assistant-v2 button.send:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 14px rgba(59,130,246,.45);} 
#ai-assistant-v2 button.send:disabled {opacity:.55;cursor:not-allowed;}
#ai-assistant-v2 .hint {font-size:11px;color:var(--assistant-muted);display:flex;justify-content:space-between;align-items:center;}

/* Floating trigger */
#assistantTriggerV2 {position:fixed;bottom:20px;right:20px;z-index:1054;}
#assistantTriggerV2 button {background:var(--assistant-accent);border:none;width:60px;height:60px;border-radius:50%;color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(102,126,234,.4);cursor:pointer;transition:transform .25s,box-shadow .25s;}
#assistantTriggerV2 button:hover {transform:scale(1.1);box-shadow:0 12px 26px rgba(102,126,234,.55);} 

/* Scroll anchor button */
.scroll-anchor {position:absolute;bottom:78px;right:24px;z-index:1060;background:#1d4ed8;color:#fff;border:none;border-radius:20px;padding:6px 14px;font-size:12px;font-weight:500;box-shadow:0 6px 16px rgba(29,78,216,.35);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s,transform .2s;}
.scroll-anchor:hover {background:#2563eb;transform:translateY(-1px);} 
@media (prefers-color-scheme: dark){ .scroll-anchor {background:#3b82f6;} .scroll-anchor:hover {background:#2563eb;} }

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {--assistant-bg:#1f2937;--assistant-border:#374151;--assistant-text:#f9fafb;--assistant-muted:#9ca3af;}
  #ai-assistant-v2 {background:var(--assistant-bg);}
  .msg-bubble {background:#374151;border-color:#4b5563;color:var(--assistant-text);} 
  .user-msg .msg-bubble {color:#fff;}
  #ai-assistant-v2 textarea {background:#374151;border-color:#4b5563;color:var(--assistant-text);} 
}

@media (max-width:768px){#ai-assistant-v2{width:calc(100vw - 20px);height:calc(100vh - 20px);inset:auto 10px 10px 10px;}}

@media print {#ai-assistant-v2,#assistantTriggerV2{display:none!important;}}

/* Action Buttons */
.action-buttons-container {
  margin: 12px 0;
  padding: 14px;
  background: rgba(59, 130, 246, 0.05);
  border: 1px solid rgba(59, 130, 246, 0.15);
  border-radius: 12px;
  animation: fadeIn 0.3s ease;
}

.actions-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--assistant-accent-start);
}

.actions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}

.action-button {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 12px;
  line-height: 1.3;
  min-height: 60px;
}

.action-button:hover {
  background: #f8fafc;
  border-color: var(--assistant-accent-start);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);
}

.action-button i {
  font-size: 16px;
  color: var(--assistant-accent-start);
  margin-bottom: 2px;
}

.action-label {
  font-weight: 600;
  color: var(--assistant-text);
  word-break: break-word;
}

.action-description {
  font-size: 11px;
  color: var(--assistant-muted);
  opacity: 0.85;
  word-break: break-word;
}

/* Action button variations */
.action-navigate {
  border-left: 3px solid #3b82f6;
}

.action-search_shipment {
  border-left: 3px solid #10b981;
}

.action-generate_report {
  border-left: 3px solid #f59e0b;
}

.action-show_urgent_items {
  border-left: 3px solid #ef4444;
}

.action-show_recent_activity {
  border-left: 3px solid #8b5cf6;
}

.action-show_recommendations {
  border-left: 3px solid #06b6d4;
}

/* Dark mode adjustments for action buttons */
@media (prefers-color-scheme: dark) {
  .action-buttons-container {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.25);
  }
  
  .action-button {
    background: #374151;
    border-color: #4b5563;
  }
  
  .action-button:hover {
    background: #4b5563;
    border-color: var(--assistant-accent-start);
  }
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  .actions-grid {
    grid-template-columns: 1fr;
  }
  
  .action-button {
    min-height: 50px;
    padding: 8px 10px;
  }
}