/* Replanta AI Chat — Widget styles */
/* Variables set dynamically by JS: --rac-primary, --rac-primary-text, --rac-right, --rac-left, --rac-bottom */

:root {
  --rac-primary: #2d6a4f;
  --rac-primary-text: #fff;
  --rac-bg: #fff;
  --rac-border: #e5e7eb;
  --rac-text: #111827;
  --rac-text-muted: #6b7280;
  --rac-user-bg: var(--rac-primary);
  --rac-user-text: var(--rac-primary-text);
  --rac-assistant-bg: #f3f4f6;
  --rac-radius: 12px;
  --rac-shadow: 0 10px 40px rgba(0,0,0,.18);
  --rac-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --rac-z: 99999;
}

/* ── Variables extendidas para soporte de temas ───────────────── */
replanta-ai-chat {
  --rac-header-bg:         var(--rac-primary);
  --rac-header-text:       var(--rac-primary-text);
  --rac-header-gradient:   linear-gradient(135deg, rgba(255,255,255,.10) 0%, rgba(0,0,0,.15) 100%);
  --rac-header-border:     transparent;
  --rac-assistant-border:  transparent;
  --rac-user-border:       transparent;
  --rac-input-bg:          #fff;
  --rac-input-color:       var(--rac-text);
  --rac-cart-bg:           #f0fdf4;
  --rac-cart-border:       #bbf7d0;
  --rac-order-bg:          #f9fafb;
  --rac-no-img-bg:         #f3f4f6;
  --rac-chip-bg:           transparent;
  --rac-chip-color:        var(--rac-primary);
  --rac-chip-border:       var(--rac-primary);
  --rac-chip-hover-bg:     var(--rac-primary);
  --rac-chip-hover-color:  var(--rac-primary-text);
  --rac-panel-backdrop:    none;
  --rac-pulse-color:       rgba(0,0,0,.22);
  /* D1+D2: error state vars — overridable per theme */
  --rac-error-bg:          #fef2f2;
  --rac-error-border:      #fecaca;
  --rac-error-text:        #b91c1c;
}

/* ── Tema Replanta (oscuro / glassmorphism) ───────────────────── */
replanta-ai-chat[data-rac-theme="replanta"] {
  --rac-bg:               rgba(13,27,18,.94);
  --rac-border:           rgba(255,255,255,.1);
  --rac-text:             rgba(255,255,255,.9);
  --rac-text-muted:       rgba(255,255,255,.4);
  --rac-shadow:           0 24px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(65,153,159,.1);
  --rac-radius:           16px;
  --rac-user-bg:          rgba(255,255,255,.1);
  --rac-user-text:        rgba(255,255,255,.85);
  --rac-user-border:      rgba(255,255,255,.12);
  --rac-assistant-bg:     rgba(65,153,159,.14);
  --rac-assistant-border: rgba(65,153,159,.2);
  --rac-header-bg:        rgba(65,153,159,.12);
  --rac-header-text:      rgba(255,255,255,.9);
  --rac-header-gradient:  none;
  --rac-header-border:    rgba(65,153,159,.2);
  --rac-input-bg:         rgba(255,255,255,.06);
  --rac-input-color:      rgba(255,255,255,.85);
  --rac-cart-bg:          rgba(65,153,159,.12);
  --rac-cart-border:      rgba(65,153,159,.3);
  --rac-order-bg:         rgba(255,255,255,.05);
  --rac-no-img-bg:        rgba(255,255,255,.05);
  --rac-chip-bg:          transparent;
  --rac-chip-color:       rgba(255,255,255,.8);
  --rac-chip-border:      rgba(65,153,159,.5);
  --rac-chip-hover-bg:    rgba(65,153,159,.22);
  --rac-chip-hover-color: #fff;
  --rac-panel-backdrop:   blur(16px);
  --rac-pulse-color:      rgba(65,153,159,.4);
}

replanta-ai-chat {
  position: fixed;
  bottom: var(--rac-bottom, 24px);
  right: var(--rac-right, 24px);
  left: var(--rac-left, auto);
  z-index: var(--rac-z);
  font-family: var(--rac-font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--rac-text);
}

/* ── Bubble ──────────────────────────────────────────────────────────────── */

.rac-bubble {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 50%;
  background: var(--rac-btn-bg, var(--rac-primary));
  background-image: linear-gradient(135deg, rgba(255,255,255,.12) 0%, rgba(0,0,0,.08) 100%);
  color: var(--rac-btn-text, var(--rac-primary-text));
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,0,0,.22);
  position: relative;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.rac-bubble-icon { display:flex; align-items:center; justify-content:center; }
.rac-bubble-icon img { width:26px; height:26px; object-fit:contain; }

.rac-bubble:hover {
  background: var(--rac-btn-hover-bg, var(--rac-btn-bg, var(--rac-primary)));
  background-image: linear-gradient(135deg, rgba(255,255,255,.12) 0%, rgba(0,0,0,.08) 100%);
  transform: scale(1.08);
  box-shadow: 0 6px 24px rgba(0,0,0,.32);
}

@keyframes rac-pulse-ring {
  0%   { box-shadow: 0 4px 20px rgba(0,0,0,.22), 0 0 0 0  rgba(0,0,0,.22); }
  70%  { box-shadow: 0 4px 20px rgba(0,0,0,.22), 0 0 0 18px rgba(0,0,0,0);  }
  100% { box-shadow: 0 4px 20px rgba(0,0,0,.22), 0 0 0 0  rgba(0,0,0,0);   }
}

.rac-bubble--pulse {
  animation: rac-pulse-ring 1.8s ease-out 3;
}

.rac-bubble--hidden {
  opacity: 0;
  transform: scale(0.5);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}

.rac-bubble svg {
  width: 26px;
  height: 26px;
  pointer-events: none;
}

.rac-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ef4444;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
}

/* ── Panel ───────────────────────────────────────────────────────────────── */

.rac-panel {
  position: absolute;
  bottom: 68px;
  right: 0;
  width: 360px;
  max-width: calc(100vw - 32px);
  height: 520px;
  max-height: calc(100vh - 120px);
  background: var(--rac-bg);
  border: 1px solid var(--rac-border);
  border-radius: var(--rac-radius);
  box-shadow: var(--rac-shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  transform: translateY(12px) scale(0.97);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
  backdrop-filter: var(--rac-panel-backdrop, none);
  -webkit-backdrop-filter: var(--rac-panel-backdrop, none);
}

.rac-panel--open {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

/* ── Header ──────────────────────────────────────────────────────────────── */

.rac-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: var(--rac-header-bg);
  background-image: var(--rac-header-gradient);
  color: var(--rac-header-text);
  border-bottom: 1px solid var(--rac-header-border, transparent);
  flex-shrink: 0;
}

.rac-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.rac-avatar svg {
  width: 18px;
  height: 18px;
  color: #fff;
}

.rac-avatar img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  border-radius: 4px;
  display: block;
}

.rac-header-info {
  flex: 1;
  min-width: 0;
}

.rac-name {
  display: block;
  font-weight: 600;
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rac-status {
  display: block;
  font-size: 11px;
  opacity: .8;
}

.rac-status::before {
  content: '';
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4ade80;
  margin-right: 4px;
  vertical-align: middle;
}

/* AI Act: the header says it is an AI assistant (no green "online" dot). */
.rac-status--ai::before { display: none; }
.rac-status--ai { cursor: help; }

.rac-close-btn,
.rac-clear-btn {
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
  padding: 4px;
  opacity: .8;
  border-radius: 6px;
  transition: opacity .15s;
  display: flex;
  align-items: center;
}

.rac-close-btn:hover,
.rac-clear-btn:hover { opacity: 1; }

.rac-close-btn svg,
.rac-clear-btn svg { width: 18px; height: 18px; }

/* ── Privacy / AI notice ─────────────────────────────────────────────────── */

.rac-notice {
  font-size: 11.5px;
  line-height: 1.45;
  opacity: .85;
  border: 1px solid rgba(127, 127, 127, .25);
  border-radius: 10px;
  padding: 8px 10px;
  margin: 0 0 10px;
}

.rac-notice p { margin: 0 0 4px; }
.rac-notice p:last-of-type { margin-bottom: 0; }
.rac-notice a { color: inherit; text-decoration: underline; }
.rac-notice-ai { font-weight: 600; }

.rac-notice--attention {
  opacity: 1;
  border-color: var(--rac-primary, #2d6a4f);
  box-shadow: 0 0 0 2px rgba(45, 106, 79, .15);
}

.rac-notice-accept {
  margin-top: 8px;
  background: var(--rac-primary, #2d6a4f);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

/* ── Messages ────────────────────────────────────────────────────────────── */

.rac-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  scroll-behavior: smooth;
}

.rac-messages::-webkit-scrollbar { width: 4px; }
.rac-messages::-webkit-scrollbar-track { background: transparent; }
.rac-messages::-webkit-scrollbar-thumb { background: var(--rac-border); border-radius: 2px; }

.rac-msg {
  display: flex;
  flex-direction: column;
  max-width: 85%;
  animation: rac-slide-in .22s ease;
}

@keyframes rac-slide-in {
  from { opacity: 0; transform: translateY(7px); }
  to   { opacity: 1; transform: translateY(0); }
}

.rac-msg--user {
  align-self: flex-end;
  align-items: flex-end;
}

.rac-msg--assistant {
  align-self: flex-start;
  align-items: flex-start;
}

.rac-msg-bubble {
  padding: 10px 13px;
  border-radius: 16px;
  font-size: 14px;
  line-height: 1.55;
  word-break: break-word;
}

.rac-msg--user .rac-msg-bubble {
  background: var(--rac-user-bg);
  color: var(--rac-user-text);
  border: 1px solid var(--rac-user-border, transparent);
  border-bottom-right-radius: 4px;
}

.rac-msg--assistant .rac-msg-bubble {
  background: var(--rac-assistant-bg);
  color: var(--rac-text);
  border: 1px solid var(--rac-assistant-border, transparent);
  border-bottom-left-radius: 4px;
}

.rac-msg-bubble p { margin: 0 0 6px; }
.rac-msg-bubble p:last-child { margin-bottom: 0; }
.rac-msg-bubble ul { margin: 4px 0 4px 16px; padding: 0; }
.rac-msg-bubble li { margin-bottom: 3px; }
.rac-msg-bubble strong { font-weight: 600; }
.rac-msg-bubble code { font-size: 12px; background: rgba(0,0,0,.07); padding: 1px 4px; border-radius: 3px; }

/* Loading dots */
.rac-typing {
  display: flex;
  gap: 4px;
  align-items: center;
  height: 18px;
}

.rac-typing span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rac-text-muted);
  animation: rac-bounce 1.2s infinite ease-in-out;
}

.rac-typing span:nth-child(1) { animation-delay: 0s; }
.rac-typing span:nth-child(2) { animation-delay: .2s; }
.rac-typing span:nth-child(3) { animation-delay: .4s; }

@keyframes rac-bounce {
  0%, 80%, 100% { transform: scale(0.7); opacity: .5; }
  40%           { transform: scale(1);   opacity: 1;  }
}

/* Feedback */
.rac-feedback {
  display: flex;
  gap: 4px;
  margin-top: 4px;
}

.rac-fb-btn {
  background: none;
  border: 1px solid var(--rac-border);
  border-radius: 6px;
  padding: 2px 7px;
  font-size: 13px;
  cursor: pointer;
  transition: background .15s;
}

.rac-fb-btn:hover { background: var(--rac-border); }

.rac-fb-thanks {
  font-size: 12px;
  color: var(--rac-text-muted);
}

/* Product cards — all selectors scoped to replanta-ai-chat to beat theme overrides */
replanta-ai-chat .rac-product-cards {
  display: flex !important;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
  scrollbar-color: var(--rac-border) transparent;
}

replanta-ai-chat .rac-product-card {
  flex-shrink: 0 !important;
  width: 190px !important;
  min-height: 100px;
  background: var(--rac-bg, #fff) !important;
  border: 1px solid var(--rac-border) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  transition: box-shadow .15s;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box;
}

replanta-ai-chat .rac-product-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.1); }

/* Top area: thumb + info in a horizontal row */
replanta-ai-chat .rac-card-link {
  display: flex !important;
  gap: 10px;
  padding: 10px !important;
  text-decoration: none !important;
  color: var(--rac-text) !important;
  align-items: flex-start;
}

replanta-ai-chat .rac-card-link:hover { color: var(--rac-text) !important; }

replanta-ai-chat .rac-card-thumb {
  flex-shrink: 0 !important;
  width: 64px !important;
  height: 64px !important;
  border-radius: 7px;
  overflow: hidden;
  background: var(--rac-no-img-bg, #f3f4f6) !important;
}

replanta-ai-chat .rac-card-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

replanta-ai-chat .rac-card-info {
  flex: 1 !important;
  min-width: 0;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center;
  gap: 3px;
}

replanta-ai-chat .rac-card-name {
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  overflow: hidden;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: var(--rac-text) !important;
}

replanta-ai-chat .rac-card-price {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--rac-primary) !important;
  font-variant-numeric: tabular-nums;
}

replanta-ai-chat .rac-card-stock {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  font-size: 10px !important;
}

replanta-ai-chat .rac-card-stock::before {
  content: '' !important;
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  flex-shrink: 0;
}

replanta-ai-chat .rac-in-stock  { color: var(--rac-text-muted, #6b7280) !important; }
replanta-ai-chat .rac-out-stock { color: var(--rac-text-muted, #6b7280) !important; }
replanta-ai-chat .rac-in-stock::before  { background: #16a34a !important; }
replanta-ai-chat .rac-out-stock::before { background: #dc2626 !important; }

/* Actions row: qty selector + CTA button */
replanta-ai-chat .rac-card-actions {
  display: flex !important;
  align-items: center;
  gap: 6px;
  padding: 7px 10px 9px !important;
  border-top: 1px solid var(--rac-border) !important;
  margin-top: auto;
}

/* Cart adding indicator */
.rac-cart-adding {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 13px;
  background: var(--rac-border);
  color: var(--rac-text-muted, var(--rac-text));
  opacity: .75;
}

/* Cart error — D1+D2: slide-in animation + CSS vars for dark mode */
.rac-cart-error {
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 13px;
  background: var(--rac-error-bg, #fef2f2);
  border: 1px solid var(--rac-error-border, #fecaca);
  color: var(--rac-error-text, #b91c1c);
  animation: rac-slide-in .22s ease;
}

/* Cart confirmation */
.rac-cart-confirm {
  background: var(--rac-cart-bg, #f0fdf4);
  border: 1px solid var(--rac-cart-border, #bbf7d0);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.rac-escalation-notice {
  background: var(--rac-cart-bg, #f0fdf4);
  border: 1px solid var(--rac-cart-border, #bbf7d0);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 13px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  animation: rac-slide-in .22s ease;
}

.rac-btn-whatsapp {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 16px;
  background: #25D366;
  color: #fff;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .15s;
  font-family: var(--rac-font);
}
.rac-btn-whatsapp:hover { opacity: .88; color: #fff; }

.rac-btn-cart,
.rac-btn-checkout {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .15s;
}

.rac-btn-cart {
  background: var(--rac-border);
  color: var(--rac-text);
}

.rac-btn-checkout {
  background: var(--rac-primary);
  color: var(--rac-primary-text);
}

.rac-btn-cart:hover,
.rac-btn-checkout:hover { opacity: .85; }

/* Order summary */
.rac-order-box {
  background: var(--rac-order-bg, #f9fafb);
  border: 1px solid var(--rac-border);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 13px;
}

.rac-order-box ul {
  margin: 0 0 8px;
  padding-left: 16px;
}

.rac-order-total { margin: 0 0 10px; }

/* ── Footer ──────────────────────────────────────────────────────────────── */

.rac-footer {
  padding: 10px 12px;
  /* D5: safe-area-inset-bottom for iOS home indicator */
  padding-bottom: max(10px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--rac-border);
  flex-shrink: 0;
}

.rac-form {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.rac-input {
  flex: 1;
  border: 1px solid var(--rac-border);
  border-radius: 20px;
  padding: 9px 14px;
  font-size: 14px;
  font-family: var(--rac-font);
  resize: none;
  overflow: hidden;
  line-height: 1.4;
  outline: none;
  transition: border-color .15s;
  max-height: 120px;
  background: var(--rac-input-bg, #fff);
  color: var(--rac-input-color, var(--rac-text));
}

.rac-input:focus { border-color: var(--rac-primary); }

replanta-ai-chat .rac-send {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  border-radius: 50% !important;
  background: var(--rac-primary) !important;
  color: var(--rac-primary-text, #fff) !important;
  border: none !important;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  align-self: flex-end;
  transition: opacity .15s;
  aspect-ratio: 1;
  box-sizing: content-box;
  padding: 0 !important;
  outline: none;
}

replanta-ai-chat .rac-send:hover:not(:disabled) {
  background: var(--rac-primary) !important;
  opacity: .85;
}
replanta-ai-chat .rac-send:disabled { opacity: .5; cursor: not-allowed; }
replanta-ai-chat .rac-send svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  visibility: visible !important;
  flex-shrink: 0;
  pointer-events: none;
}

replanta-ai-chat .rac-card-cta svg,
replanta-ai-chat .rac-chip svg,
replanta-ai-chat .rac-bubble-icon svg,
replanta-ai-chat .rac-avatar svg {
  display: block !important;
  visibility: visible !important;
  flex-shrink: 0;
}

.rac-powered {
  text-align: center;
  font-size: 10px;
  color: var(--rac-text-muted);
  margin: 6px 0 0;
}

.rac-powered a {
  color: var(--rac-primary);
  text-decoration: none;
}

/* ── Retry button (M1) ───────────────────────────────────────────────────── */

.rac-retry-btn {
  display: inline-block;
  margin-top: 6px;
  padding: 5px 12px;
  border-radius: 6px;
  border: 1px solid var(--rac-border);
  background: var(--rac-bg);
  color: var(--rac-text);
  font-size: 12px;
  font-family: var(--rac-font);
  cursor: pointer;
  transition: background .15s;
}
.rac-retry-btn:hover { background: var(--rac-border); }

/* ── Quantity selector (M2) ──────────────────────────────────────────────── */

.rac-qty-row {
  display: flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
}
.rac-qty-btn {
  width: 22px;
  height: 22px;
  border-radius: 5px;
  border: 1px solid var(--rac-border);
  background: var(--rac-bg, #f9fafb);
  color: var(--rac-text);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  font-family: var(--rac-font);
  transition: background .15s;
}
.rac-qty-btn:hover { background: var(--rac-border); }
.rac-qty-display {
  font-size: 12px;
  font-weight: 600;
  width: 22px;
  text-align: center;
  color: var(--rac-text);
  font-variant-numeric: tabular-nums;
  user-select: none;
}

/* ── Quick reply chips ───────────────────────────────────────────────────── */

.rac-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  padding-left: 2px;
}

.rac-chip {
  display: inline-flex;
  align-items: center;
  background: var(--rac-chip-bg, transparent);
  border: 1.5px solid var(--rac-chip-border, var(--rac-primary));
  color: var(--rac-chip-color, var(--rac-primary));
  border-radius: 20px;
  padding: 5px 14px;
  font-size: 13px;
  font-family: var(--rac-font);
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, color .15s, border-color .15s;
  animation: rac-slide-in .2s ease;
}

.rac-chip:hover {
  background: var(--rac-chip-hover-bg, var(--rac-primary));
  color: var(--rac-chip-hover-color, var(--rac-primary-text));
  border-color: var(--rac-chip-hover-bg, var(--rac-primary));
}

/* ── Product card CTA button ─────────────────────────────────────────────── */

replanta-ai-chat .rac-card-cta {
  flex: 1;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 8px;
  background: var(--rac-primary) !important;
  color: var(--rac-primary-text) !important;
  border: none !important;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  font-family: var(--rac-font);
  cursor: pointer;
  text-align: center;
  transition: opacity .15s;
  line-height: 1.3;
  white-space: nowrap;
  text-decoration: none;
}

replanta-ai-chat .rac-card-cta:hover:not(:disabled) {
  background: var(--rac-primary) !important;
  opacity: .82;
  color: var(--rac-primary-text) !important;
}
replanta-ai-chat .rac-card-cta:disabled { opacity: .45; cursor: not-allowed; }

/* ── Tema Replanta: grid overlay + ajustes específicos ───────────────────── */

replanta-ai-chat[data-rac-theme="replanta"] .rac-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(65,153,159,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(65,153,159,.035) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
  z-index: 0;
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-header,
replanta-ai-chat[data-rac-theme="replanta"] .rac-messages,
replanta-ai-chat[data-rac-theme="replanta"] .rac-footer {
  position: relative;
  z-index: 1;
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-messages::-webkit-scrollbar-thumb {
  background: rgba(65,153,159,.3);
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-input {
  background: rgba(255,255,255,.07) !important;
  color: rgba(255,255,255,.85) !important;
  border-color: rgba(65,153,159,.35);
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-input::placeholder {
  color: rgba(255,255,255,.3);
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-typing span {
  background: rgba(65,153,159,.5);
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-bubble {
  box-shadow: 0 4px 20px rgba(0,0,0,.3), 0 0 16px rgba(65,153,159,.2);
}

@keyframes rac-pulse-ring-rep {
  0%   { box-shadow: 0 4px 20px rgba(0,0,0,.3), 0 0 0 0  rgba(65,153,159,.4); }
  70%  { box-shadow: 0 4px 20px rgba(0,0,0,.3), 0 0 0 18px rgba(65,153,159,0); }
  100% { box-shadow: 0 4px 20px rgba(0,0,0,.3), 0 0 0 0  rgba(65,153,159,0); }
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-bubble--pulse {
  animation: rac-pulse-ring-rep 1.8s ease-out 3;
}

replanta-ai-chat[data-rac-theme="replanta"] .rac-fb-btn:hover {
  background: rgba(255,255,255,.1);
}

/* D2: dark theme error state */
replanta-ai-chat[data-rac-theme="replanta"] {
  --rac-error-bg:     rgba(220, 38, 38, .12);
  --rac-error-border: rgba(220, 38, 38, .30);
  --rac-error-text:   #fca5a5;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 480px) {
  .rac-panel {
    width: calc(100vw - 16px);
    height: calc(100vh - 100px);
    right: 8px;
    bottom: 68px;
  }

  /* D3: ensure close button meets 44px touch target on mobile */
  .rac-close-btn {
    padding: 13px;
  }
}