/* EPC AI Agent Widget v1.0.13 — EPFinder brand style */
:root {
  --epc-accent: #1a3a5c;
  --epc-accent-light: #2a5a8c;
  --epc-shadow: 0 12px 48px rgba(0,0,0,0.22), 0 2px 8px rgba(0,0,0,0.12);
}

#epc-agent-root {
  position: fixed !important;
  z-index: 2147483647 !important;
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
#epc-agent-root.epc-agent-pos-bottom-right { bottom: 24px !important; right: 24px !important; left: auto !important; top: auto !important; }
#epc-agent-root.epc-agent-pos-bottom-left  { bottom: 24px !important; left: 24px !important; right: auto !important; top: auto !important; }
#epc-agent-root *, #epc-agent-root *::before, #epc-agent-root *::after { box-sizing: border-box !important; }

/* ── FAB — matches EPFinder dark navy circle style ─────────────────────── */
#epc-agent-root #epc-agent-fab {
  all: unset !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  width: 52px !important; height: 52px !important; border-radius: 50% !important;
  background: #0e2a47 !important;
  color: #fff !important; cursor: pointer !important;
  box-shadow: 0 4px 16px rgba(14,42,71,0.45), 0 1px 4px rgba(0,0,0,0.2) !important;
  transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease !important;
  border: 2px solid rgba(255,255,255,0.12) !important;
}
#epc-agent-root #epc-agent-fab:hover  {
  background: #1a4a7a !important;
  box-shadow: 0 6px 24px rgba(14,42,71,0.55), 0 2px 6px rgba(0,0,0,0.25) !important;
  transform: scale(1.06) !important;
}
#epc-agent-root #epc-agent-fab:active { transform: scale(0.95) !important; }
#epc-agent-root #epc-agent-fab svg {
  display: block !important; width: 22px !important; height: 22px !important;
  flex-shrink: 0 !important; fill: none !important; stroke: #fff !important;
  stroke-width: 2 !important; pointer-events: none !important;
}

/* ── Chat window ───────────────────────────────────────────────────────── */
#epc-agent-root #epc-agent-window {
  position: absolute !important;
  bottom: 68px !important;
  width: 702px !important;
  max-height: 660px !important;
  min-height: 200px !important;
  background: #f8fafc !important;
  border-radius: 14px !important;
  box-shadow: var(--epc-shadow) !important;
  display: none !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid rgba(14,42,71,0.14) !important;
}
.epc-agent-pos-bottom-right #epc-agent-window { right: 0 !important; left: auto !important; }
.epc-agent-pos-bottom-left  #epc-agent-window { left: 0 !important; right: auto !important; }
#epc-agent-root #epc-agent-window.epc-open { display: flex !important; animation: epc-slide-up 0.2s ease !important; }

@keyframes epc-slide-up {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Header — dark navy gradient matching EPFinder nav ─────────────────── */
#epc-agent-root #epc-agent-header {
  background: linear-gradient(135deg, #0e2a47 0%, #1a3f6b 100%) !important;
  padding: 14px 18px !important;
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; flex-shrink: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
#epc-agent-root .epc-header-info  { display: flex !important; align-items: center !important; gap: 12px !important; }
#epc-agent-root .epc-avatar-dot {
  width: 38px !important; height: 38px !important; min-width: 38px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.12) !important;
  border: 1.5px solid rgba(255,255,255,0.25) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 17px !important;
  overflow: hidden !important;
}
/* Only show lightning bolt when no logo image is present */
#epc-agent-root .epc-avatar-dot:not(:has(img))::after { content: '⚡' !important; }
#epc-agent-root .epc-avatar-dot:has(img) { background: transparent !important; border-color: transparent !important; }
/* FAB button spacing between logo and label */
#epc-agent-fab { gap: 10px !important; }
#epc-agent-root .epc-header-name { font-size: 14px !important; font-weight: 700 !important; color: #fff !important; margin: 0 !important; letter-spacing: 0.01em !important; }
#epc-agent-root .epc-header-sub  { font-size: 11px !important; color: rgba(255,255,255,0.6) !important; margin: 2px 0 0 !important; }
#epc-agent-root .epc-header-actions { display: flex !important; gap: 6px !important; align-items: center !important; }
#epc-agent-root .epc-header-actions button {
  all: unset !important;
  background: rgba(255,255,255,0.1) !important; border-radius: 7px !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: #fff !important; cursor: pointer !important; font-size: 11.5px !important;
  padding: 5px 11px !important; display: flex !important; align-items: center !important;
  gap: 5px !important; white-space: nowrap !important; line-height: 1.4 !important;
  font-weight: 500 !important;
}
#epc-agent-root .epc-header-actions button:hover { background: rgba(255,255,255,0.2) !important; }
#epc-agent-root .epc-header-actions button svg { width: 13px !important; height: 13px !important; fill: none !important; stroke: currentColor !important; }

/* ── Messages ──────────────────────────────────────────────────────────── */
#epc-agent-root #epc-agent-messages {
  flex: 1 !important; overflow-y: auto !important; padding: 18px !important;
  display: flex !important; flex-direction: column !important; gap: 14px !important;
  scroll-behavior: smooth !important; min-height: 0 !important;
  background: #f8fafc !important;
}
#epc-agent-root #epc-agent-messages::-webkit-scrollbar { width: 5px !important; }
#epc-agent-root #epc-agent-messages::-webkit-scrollbar-track { background: transparent !important; }
#epc-agent-root #epc-agent-messages::-webkit-scrollbar-thumb { background: #c8d6e5 !important; border-radius: 4px !important; }

#epc-agent-root .epc-msg { display: flex !important; gap: 10px !important; align-items: flex-start !important; width: 100% !important; }
#epc-agent-root .epc-msg.epc-user { flex-direction: row-reverse !important; width: 100% !important; }

#epc-agent-root .epc-msg-avatar {
  width: 30px !important; height: 30px !important; min-width: 30px !important;
  border-radius: 50% !important; font-size: 10px !important; font-weight: 700 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  margin-top: 2px !important; flex-shrink: 0 !important;
  overflow: hidden !important; line-height: 1 !important;
}
#epc-agent-root .epc-msg.epc-agent .epc-msg-avatar {
  background: #dce8f5 !important; color: #0e2a47 !important;
  border: 1px solid #b8d0e8 !important;
}
#epc-agent-root .epc-msg.epc-agent .epc-msg-avatar img {
  background: none !important; border: none !important;
}
#epc-agent-root .epc-msg.epc-user .epc-msg-avatar {
  background: #e8edf2 !important; color: #555 !important;
}

/* Agent bubble — full width, white card */
#epc-agent-root .epc-msg.epc-agent .epc-msg-bubble {
  flex: 1 !important; min-width: 0 !important;
  padding: 14px 16px !important; border-radius: 12px !important; border-top-left-radius: 3px !important;
  font-size: 13px !important; line-height: 1.6 !important;
  background: #fff !important; color: #1a1a2e !important;
  border: 1px solid #e2eaf3 !important;
  box-shadow: 0 1px 4px rgba(14,42,71,0.06) !important;
  overflow: hidden !important;
}
/* User bubble */
#epc-agent-root .epc-msg.epc-user .epc-msg-bubble {
  max-width: 72% !important;
  width: auto !important;
  display: inline-block !important;
  padding: 10px 14px !important; border-radius: 12px !important; border-top-right-radius: 3px !important;
  font-size: 13px !important; line-height: 1.6 !important;
  background: #0e2a47 !important; color: #fff !important;
}

/* Markdown in bubbles */
#epc-agent-root .epc-msg-bubble p            { margin: 0 0 8px !important; }
#epc-agent-root .epc-msg-bubble p:last-child { margin-bottom: 0 !important; }
#epc-agent-root .epc-msg-bubble ul,
#epc-agent-root .epc-msg-bubble ol          { margin: 4px 0 8px 18px !important; padding: 0 !important; }
#epc-agent-root .epc-msg-bubble li          { margin-bottom: 4px !important; }
#epc-agent-root .epc-msg-bubble strong      { font-weight: 600 !important; }
#epc-agent-root .epc-msg-bubble a           { color: #1a6ec7 !important; word-break: break-all !important; }
#epc-agent-root .epc-msg-bubble code        { background: #f0f4f8 !important; padding: 2px 6px !important; border-radius: 4px !important; font-size: 12px !important; color: #0e2a47 !important; }
#epc-agent-root .epc-msg-bubble h1,
#epc-agent-root .epc-msg-bubble h2,
#epc-agent-root .epc-msg-bubble h3          { font-size: 13.5px !important; font-weight: 700 !important; margin: 10px 0 5px !important; color: #0e2a47 !important; }

/* ── Tables — scrollable both axes ─────────────────────────────────────── */
#epc-agent-root .epc-table-wrap {
  overflow-x: auto !important;
  overflow-y: auto !important;
  max-height: 320px !important;
  -webkit-overflow-scrolling: touch !important;
  margin: 10px 0 !important;
  border-radius: 10px !important;
  border: 1px solid #d0dcea !important;
  box-shadow: 0 2px 6px rgba(14,42,71,0.08) !important;
}
#epc-agent-root .epc-table-wrap::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
#epc-agent-root .epc-table-wrap::-webkit-scrollbar-track { background: #f0f4f8 !important; border-radius: 3px !important; }
#epc-agent-root .epc-table-wrap::-webkit-scrollbar-thumb { background: #a0b8d0 !important; border-radius: 3px !important; }

#epc-agent-root .epc-msg-bubble table {
  width: 100% !important;
  min-width: 700px !important;
  border-collapse: collapse !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  table-layout: auto !important;
}
#epc-agent-root .epc-msg-bubble thead { position: sticky !important; top: 0 !important; z-index: 2 !important; }
#epc-agent-root .epc-msg-bubble thead tr th,
#epc-agent-root .epc-msg-bubble th {
  background: #0e2a47 !important;
  background-color: #0e2a47 !important;
  color: #fff !important;
  padding: 11px 16px !important;
  text-align: left !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  white-space: nowrap !important;
  border: none !important;
  border-bottom: 2px solid #1a4a7a !important;
}
#epc-agent-root .epc-msg-bubble th:first-child { border-radius: 0 !important; }
#epc-agent-root .epc-msg-bubble td {
  padding: 10px 16px !important; border-bottom: 1px solid #e8eef5 !important;
  color: #1e2d3d !important; white-space: nowrap !important;
  vertical-align: middle !important; line-height: 1.5 !important;
  font-size: 13px !important;
}
/* Product name column: min-width only, no max-width cap */
#epc-agent-root .epc-msg-bubble td:first-child {
  white-space: nowrap !important;
  min-width: 160px !important;
}
/* Actions column: never clip buttons */
#epc-agent-root .epc-msg-bubble td:last-child,
#epc-agent-root .epc-msg-bubble th:last-child {
  white-space: nowrap !important;
  min-width: 180px !important;
}
#epc-agent-root .epc-msg-bubble tr:last-child td   { border-bottom: none !important; }
#epc-agent-root .epc-msg-bubble tbody tr:nth-child(odd) td { background: #fff !important; background-color: #fff !important; }
#epc-agent-root .epc-msg-bubble tbody tr:nth-child(even) td { background: #f0f5fb !important; background-color: #f0f5fb !important; }
#epc-agent-root .epc-msg-bubble tr:hover td { background: #e4eef8 !important; background-color: #e4eef8 !important; transition: background 0.12s !important; }

/* ── Typing dots ─────────────────────────────────────────────────────────*/
#epc-agent-root .epc-typing .epc-msg-bubble {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  min-height: 38px;
}
#epc-agent-root .epc-typing-dot { display: none !important; }
@keyframes epc-bounce { 0%,80%,100% { transform: translateY(0); opacity:.6; } 40% { transform: translateY(-7px); opacity:1; } }

/* ── BOM panel ───────────────────────────────────────────────────────────*/
/* ── BOM Panel ───────────────────────────────────────────────────────────*/
#epc-agent-root #epc-bom-panel {
  border-top: 1px solid #e8eef5 !important;
  padding: 16px 18px !important;
  background: #fff !important;
  flex-shrink: 0 !important;
}
#epc-agent-root .epc-bom-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 14px !important;
  color: #1a2a3a !important;
}
#epc-agent-root .epc-bom-header button {
  all: unset !important;
  cursor: pointer !important;
  width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 7px !important;
  font-size: 16px !important;
  color: #8a9ab0 !important;
  transition: background 0.12s !important;
  line-height: 1 !important;
}
#epc-agent-root .epc-bom-header button:hover { background: #f0f4f8 !important; color: #1a2a3a !important; }
#epc-agent-root #epc-bom-input {
  display: block !important;
  width: 100% !important;
  height: 120px !important;
  resize: vertical !important;
  border: 1.5px solid #dde6ef !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  font-size: 13px !important;
  font-family: inherit !important;
  color: #1a2a3a !important;
  background: #f8fafc !important;
  outline: none !important;
  line-height: 1.6 !important;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s !important;
}
#epc-agent-root #epc-bom-input:focus {
  border-color: #4a90d9 !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(74,144,217,0.12) !important;
}
#epc-agent-root #epc-bom-submit {
  all: unset !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: 100% !important;
  margin-top: 12px !important;
  padding: 11px 16px !important;
  background: #0e2a47 !important;
  color: #fff !important;
  border-radius: 10px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  letter-spacing: 0.01em !important;
  transition: background 0.15s !important;
}
#epc-agent-root #epc-bom-submit:hover   { background: #1a4472 !important; }
#epc-agent-root #epc-bom-submit:disabled { opacity: 0.45 !important; cursor: not-allowed !important; }

/* ── Input row ──────────────────────────────────────────────────────────*/
#epc-agent-root #epc-agent-input-row {
  display: flex !important; align-items: flex-end !important; gap: 8px !important;
  padding: 12px 14px !important; border-top: 1px solid #e0eaf3 !important;
  background: #fff !important; flex-shrink: 0 !important;
}
#epc-agent-root #epc-input-wrap { flex: 1 !important; min-width: 0 !important; }
#epc-agent-root #epc-agent-input {
  display: block !important; width: 100% !important;
  border: 1.5px solid #c8d8e8 !important; border-radius: 9px !important;
  padding: 9px 14px !important; font-size: 13.5px !important; font-family: inherit !important;
  color: #1e2d3d !important; background: #f8fafc !important;
  resize: none !important; outline: none !important; line-height: 1.5 !important;
  max-height: 100px !important; overflow-y: auto !important;
  transition: border-color 0.15s, box-shadow 0.15s !important;
}
#epc-agent-root #epc-agent-input:focus {
  border-color: #1a6ec7 !important;
  box-shadow: 0 0 0 3px rgba(26,110,199,0.12) !important;
  background: #fff !important;
}
#epc-agent-root #epc-agent-send {
  all: unset !important; display: flex !important; align-items: center !important;
  justify-content: center !important; width: 40px !important; height: 40px !important;
  min-width: 40px !important; border-radius: 9px !important;
  background: #0e2a47 !important; color: #fff !important; cursor: pointer !important;
  flex-shrink: 0 !important; transition: background 0.15s, transform 0.12s !important;
}
#epc-agent-root #epc-agent-send:hover  { background: #1a4a7a !important; }
#epc-agent-root #epc-agent-send:active { transform: scale(0.93) !important; }
#epc-agent-root #epc-agent-send:disabled { opacity: 0.45 !important; cursor: not-allowed !important; }
#epc-agent-root #epc-agent-send svg { width: 17px !important; height: 17px !important; fill: none !important; stroke: #fff !important; display: block !important; }

/* ── Footer ─────────────────────────────────────────────────────────────*/
#epc-agent-root #epc-agent-footer {
  text-align: center !important; font-size: 10.5px !important; color: #a0b0c0 !important;
  padding: 6px 0 8px !important; background: #fff !important; flex-shrink: 0 !important;
  border-top: 1px solid #f0f4f8 !important;
}

/* ── Mobile ──────────────────────────────────────────────────────────── */
@media (max-width: 740px) {
  #epc-agent-root #epc-agent-window {
    width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 90px) !important;
  }
  .epc-agent-pos-bottom-right #epc-agent-window { right: -8px !important; }
  .epc-agent-pos-bottom-left  #epc-agent-window { left: -8px !important; }
  #epc-agent-root .epc-msg-bubble table { min-width: 380px !important; }
}

/* Upload button in input row */
#epc-agent-root #epc-upload-btn {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #8faabf !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: color .15s, background .15s !important;
  margin-right: 2px !important;
}
#epc-agent-root #epc-upload-btn:hover {
  color: #0e2a47 !important;
  background: #f0f5fa !important;
}

/* File preview bubble in chat */
#epc-agent-root .epc-file-preview {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  background: #f0f5fa !important;
  border: 1px solid #d0dcea !important;
  border-radius: 10px !important;
  font-size: 12.5px !important;
  color: #0e2a47 !important;
  margin-bottom: 6px !important;
}
#epc-agent-root .epc-file-preview img {
  width: 48px !important;
  height: 48px !important;
  object-fit: cover !important;
  border-radius: 6px !important;
  flex-shrink: 0 !important;
}
#epc-agent-root .epc-file-preview .epc-file-icon {
  font-size: 28px !important;
  flex-shrink: 0 !important;
}
#epc-agent-root .epc-file-preview .epc-file-info strong {
  display: block !important;
  font-weight: 600 !important;
  margin-bottom: 2px !important;
}
#epc-agent-root .epc-file-preview .epc-file-info span {
  color: #7a8fa6 !important;
  font-size: 11.5px !important;
}

/* Upload button — labeled with tooltip */
#epc-agent-root .epc-upload-wrapper {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
#epc-agent-root #epc-upload-btn {
  all: unset !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
  background: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all .15s !important;
  font-family: inherit !important;
  line-height: 1 !important;
}
#epc-agent-root #epc-upload-btn:hover {
  background: rgba(255,255,255,0.22) !important;
  border-color: rgba(255,255,255,0.4) !important;
}
#epc-agent-root #epc-upload-btn svg {
  flex-shrink: 0 !important;
}

/* Tooltip popup */
#epc-agent-root .epc-upload-tooltip {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  width: 240px !important;
  background: #0e2a47 !important;
  color: #fff !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  z-index: 9999 !important;
  box-shadow: 0 4px 20px rgba(14,42,71,0.25) !important;
  pointer-events: none !important;
}
#epc-agent-root .epc-upload-tooltip::after {
  content: '' !important;
  position: absolute !important;
  top: 100% !important;
  left: 16px !important;
  border: 6px solid transparent !important;
  border-bottom-color: #0e2a47 !important; top: auto !important; bottom: 100% !important; top: -12px !important; border-top-color: transparent !important; transform: none !important;
}
#epc-agent-root .epc-upload-tooltip strong {
  display: block !important;
  font-size: 13px !important;
  margin-bottom: 6px !important;
  color: #fff !important;
}
#epc-agent-root .epc-upload-tooltip p {
  margin: 0 0 10px !important;
  color: #b8d0e8 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
#epc-agent-root .epc-upload-tooltip-types {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}
#epc-agent-root .epc-upload-tooltip-types span {
  background: rgba(255,255,255,0.12) !important;
  padding: 3px 8px !important;
  border-radius: 99px !important;
  font-size: 11px !important;
  color: #dce8f5 !important;
}
#epc-agent-root .epc-upload-wrapper:hover .epc-upload-tooltip,
#epc-agent-root #epc-upload-btn:focus + .epc-upload-tooltip {
  display: block !important;
}

/* BOM tabs */
/* BOM tabs — segmented control style */
#epc-agent-root .epc-bom-tabs {
  display: flex !important;
  gap: 0 !important;
  margin-bottom: 14px !important;
  background: #f0f4f8 !important;
  border-radius: 10px !important;
  padding: 4px !important;
}
#epc-agent-root .epc-bom-tab {
  all: unset !important;
  flex: 1 !important;
  text-align: center !important;
  padding: 8px 14px !important;
  border-radius: 7px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  color: #6b7f96 !important;
  font-family: inherit !important;
  transition: all .15s !important;
  white-space: nowrap !important;
}
#epc-agent-root .epc-bom-tab.active {
  background: #fff !important;
  color: #0e2a47 !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 4px rgba(14,42,71,0.1) !important;
}
#epc-agent-root .epc-bom-tab:not(.active):hover {
  color: #0e2a47 !important;
  background: rgba(255,255,255,0.5) !important;
}

/* BOM file drop zone */
#epc-agent-root #epc-bom-drop-zone {
  border: 1.5px dashed #c8d8e8 !important;
  border-radius: 10px !important;
  padding: 24px 16px !important;
  text-align: center !important;
  cursor: pointer !important;
  background: #f8fafc !important;
  color: #6b7f96 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  transition: all .18s !important;
  margin-bottom: 12px !important;
}
#epc-agent-root #epc-bom-drop-zone:hover,
#epc-agent-root #epc-bom-drop-zone.dragover {
  border-color: #4a90d9 !important;
  background: #eef4fd !important;
}
#epc-agent-root #epc-bom-drop-zone strong {
  display: block !important;
  color: #1a2a3a !important;
  margin-bottom: 5px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}
#epc-agent-root #epc-bom-drop-zone p {
  margin: 0 !important;
  font-size: 12px !important;
  color: #8a9ab0 !important;
}
#epc-agent-root #epc-bom-file-preview {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 10px 14px !important;
  background: #eef4fd !important;
  border: 1px solid #ccddf5 !important;
  border-radius: 9px !important;
  margin-bottom: 12px !important;
  font-size: 13px !important;
  color: #1a2a3a !important;
}
#epc-agent-root #epc-bom-file-name {
  font-weight: 600 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  flex: 1 !important;
}
#epc-agent-root #epc-bom-file-clear {
  all: unset !important;
  cursor: pointer !important;
  color: #c0392b !important;
  font-size: 12px !important;
  padding: 3px 7px !important;
  border-radius: 5px !important;
  margin-left: 8px !important;
  flex-shrink: 0 !important;
  transition: background 0.1s !important;
}
#epc-agent-root #epc-bom-file-clear:hover { background: #fde8e8 !important; }

@keyframes epai-spin {
  to { transform: rotate(360deg); }
}

/* Hide old typing dots — replaced by status text */
.epc-typing-dot { display: none !important; }

/* Always hide the close X icon in FAB */
#epc-icon-close { display: none !important; }

/* ── Fullscreen mode ──────────────────────────────────────────────────────── */
#epc-fs-overlay {
  box-sizing: border-box !important;
  background: #f0f4f8 !important;
}
#epc-fs-overlay * {
  box-sizing: border-box !important;
}
/* No sidebar — full width layout */
#epc-fs-overlay .epc-fs-sidebar {
  display: none !important;
}

/* ── Fullscreen BOM panel ── */
#epc-fs-overlay #epc-bom-panel {
  flex-shrink: 0 !important;
  max-height: 55vh !important;
  overflow-y: auto !important;
  padding: 20px clamp(20px,4vw,56px) !important;
  background: #fff !important;
  border-top: 1px solid #dde6ef !important;
}
#epc-fs-overlay .epc-bom-tabs { margin-bottom: 14px !important; }
#epc-fs-overlay #epc-bom-input { height: 130px !important; font-size: 14px !important; }
#epc-fs-overlay #epc-bom-submit { font-size: 14px !important; padding: 13px !important; }

/* ── Branding bar ── */
#epc-fs-brandbar {
  flex-shrink: 0 !important;
}

/* Hide original header — sidebar has branding */
#epc-fs-overlay #epc-agent-header {
  display: none !important;
}

/* ── Messages: full width, scroll area ── */
#epc-fs-overlay #epc-agent-messages {
  flex: 1 1 0 !important;
  overflow-y: auto !important;
  min-height: 0 !important;
  padding: 32px 0 16px !important;
  background: #f0f4f8 !important;
}

/* Message rows: full width, generous side padding */
#epc-fs-overlay #epc-agent-messages > * {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding-left: clamp(20px, 4vw, 56px) !important;
  padding-right: clamp(20px, 4vw, 56px) !important;
}

/* Message row: bounded, flex, no overflow clip on row itself */
#epc-fs-overlay .epc-msg {
  width: 100% !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

/* Extra space between a user message and the following AI response */
#epc-fs-overlay .epc-msg.epc-user {
  margin-bottom: 8px !important;
}
#epc-fs-overlay .epc-msg.epc-agent {
  margin-bottom: 28px !important;
}
#epc-fs-overlay .epc-msg.epc-user {
  flex-direction: row-reverse !important;
}

/* Agent bubble: pure white card pops against light grey background */
#epc-fs-overlay .epc-msg.epc-agent .epc-msg-bubble {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  padding: 16px 20px !important;
  word-break: break-word !important;
  background: #ffffff !important;
  border: 1px solid #dde6ef !important;
  border-radius: 14px !important;
  border-top-left-radius: 4px !important;
  box-shadow: 0 2px 8px rgba(14,42,71,0.09) !important;
  color: #1a1a2e !important;
}

/* Table inside card: remove top margin so it butts up to the text above */
#epc-fs-overlay .epc-msg.epc-agent .epc-msg-bubble .epc-table-wrap {
  margin-left: -20px !important;
  margin-right: -20px !important;
  width: calc(100% + 40px) !important;
  border-radius: 0 0 13px 13px !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
}

/* User bubble: dark pill, right-aligned, shrinks to text width */
#epc-fs-overlay .epc-msg.epc-user .epc-msg-bubble {
  max-width: 55% !important;
  width: auto !important;
  display: inline-block !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  padding: 12px 18px !important;
  background: #0e2a47 !important;
  color: #fff !important;
  border-radius: 18px !important;
  border-top-right-radius: 4px !important;
}

/* User message row: right-aligned, avatar on the right */
#epc-fs-overlay .epc-msg.epc-user {
  flex-direction: row-reverse !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* Avatar sizing: slightly larger in fullscreen */
#epc-fs-overlay .epc-msg-avatar {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}
#epc-fs-overlay .epc-msg.epc-agent .epc-msg-avatar {
  background: #dce8f5 !important;
  color: #0e2a47 !important;
  border: 1.5px solid #b8d0e8 !important;
}
#epc-fs-overlay .epc-msg.epc-user .epc-msg-avatar {
  background: #e8edf2 !important;
  color: #555 !important;
  border: 1.5px solid #d0d8e0 !important;
}



/* Table wrap: fills bubble width, proper horizontal scroll */
#epc-fs-overlay .epc-table-wrap {
  width: 100% !important;
  max-height: 520px !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
}

/* Fullscreen table: wider, taller, fully visible */
#epc-fs-overlay .epc-table-wrap {
  max-height: 560px !important;
  border-radius: 10px !important;
}
#epc-fs-overlay .epc-msg-bubble table {
  min-width: 800px !important;
  width: 100% !important;
  font-size: 14px !important;
  white-space: nowrap !important;
}
#epc-fs-overlay .epc-msg-bubble thead tr th,
#epc-fs-overlay .epc-msg-bubble th {
  background: #0e2a47 !important;
  background-color: #0e2a47 !important;
  color: #fff !important;
  font-size: 13.5px !important;
  padding: 13px 18px !important;
  white-space: nowrap !important;
  border: none !important;
  border-bottom: 2px solid #1a4a7a !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}
#epc-fs-overlay .epc-msg-bubble td {
  padding: 11px 18px !important;
  font-size: 14px !important;
  white-space: nowrap !important;
}
/* Product name column: min-width only, no max-width cap */
#epc-fs-overlay .epc-msg-bubble td:first-child {
  white-space: nowrap !important;
  min-width: 200px !important;
}
/* Actions column: never clip */
#epc-fs-overlay .epc-msg-bubble td:last-child,
#epc-fs-overlay .epc-msg-bubble th:last-child {
  white-space: nowrap !important;
  min-width: 200px !important;
}

/* ── Bottom dock: input + footer centred ── */
#epc-fs-overlay #epc-agent-input-row {
  flex-shrink: 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: flex-end !important;
  gap: 0 !important;
  width: 100% !important;
  padding: 12px clamp(20px, 4vw, 56px) 0 !important;
  border-top: 1px solid #dde6ef !important;
  background: #f8fafc !important;
}

/* Input toolbar below textarea */
#epc-fs-input-toolbar {
  width: 100% !important;
  padding-left: clamp(20px, 4vw, 56px) !important;
  padding-right: clamp(20px, 4vw, 56px) !important;
  background: #f8fafc !important;
}

/* The outer wrap becomes the visible "box" */
#epc-fs-overlay #epc-input-wrap {
  flex: 1 !important;
  min-width: 0 !important;
  background: #f5f4f0 !important;
  border: 1.5px solid #e2e1dd !important;
  border-radius: 14px !important;
  padding-bottom: 48px !important; /* space for the send btn inside */
  transition: border-color 0.15s, box-shadow 0.15s !important;
}

#epc-fs-overlay #epc-input-wrap:focus-within {
  border-color: #b0aeaa !important;
  box-shadow: 0 0 0 3px rgba(0,0,0,0.06) !important;
  background: #fff !important;
}

/* Textarea: no border, transparent, grows freely */
#epc-fs-overlay #epc-agent-input {
  display: block !important;
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  border-radius: 14px 14px 0 0 !important;
  padding: 16px 18px 4px !important;
  font-size: 15px !important;
  font-family: inherit !important;
  color: #1a1a1a !important;
  resize: none !important;
  outline: none !important;
  line-height: 1.55 !important;
  min-height: 56px !important;
  max-height: 180px !important;
  overflow-y: auto !important;
  box-shadow: none !important;
}

/* Send button: absolutely inside the wrap at bottom-right */
#epc-fs-overlay #epc-agent-send {
  all: unset !important;
  box-sizing: border-box !important;
  position: absolute !important;
  bottom: 10px !important;
  right: calc(clamp(20px, 4vw, 56px) + 10px) !important;
  bottom: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background: #1a3a5c !important;
  color: #fff !important;
  cursor: pointer !important;
  transition: background 0.15s, transform 0.12s !important;
  z-index: 2 !important;
}
#epc-fs-overlay #epc-agent-send:hover  { background: #254f80 !important; }
#epc-fs-overlay #epc-agent-send:active { transform: scale(0.92) !important; }
#epc-fs-overlay #epc-agent-send:disabled { opacity: 0.35 !important; cursor: not-allowed !important; }
#epc-fs-overlay #epc-agent-send svg {
  width: 15px !important; height: 15px !important;
  fill: none !important; stroke: #fff !important;
  stroke-width: 2 !important; display: block !important;
}

/* Footer */
#epc-fs-overlay #epc-agent-footer {
  text-align: center !important;
  color: #9aaabb !important;
  font-size: 11px !important;
  padding: 4px clamp(20px,4vw,56px) 10px !important;
  border-top: none !important;
  background: #f8fafc !important;
  flex-shrink: 0 !important;
}

#epc-fs-overlay #epc-agent-window {
  display: none !important;
}



/* ── Responsive ── */

/* Narrow sidebar on medium screens */
@media (max-width: 900px) {
  #epc-fs-overlay .epc-fs-sidebar { width: 220px !important; }
}

/* Mobile: compact padding */
@media (max-width: 640px) {
  #epc-fs-overlay #epc-agent-messages > * {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  #epc-fs-overlay #epc-agent-input-row {
    padding: 10px 14px 0 !important;
  }
  #epc-fs-overlay #epc-fs-input-toolbar {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  #epc-fs-overlay #epc-agent-send {
    right: 24px !important;
  }
  #epc-fs-overlay .epc-msg.epc-user .epc-msg-bubble {
    max-width: 80% !important;
  }
}