/* ==========================================================================
   LUX · Trading · correcciones visuales (v310). Se carga al final.
   ========================================================================== */

/* Herramientas de la izquierda cerradas: Notificaciones y LUX AUTO mostraban su
   texto recortado ("tifica…", "AUT") y el ícono quedaba corrido fuera de la vista. */
#left-sidebar:not(.tools-expanded) #lux-trading-notification-tool,
#left-sidebar:not(.tools-expanded) #lux-trading-auto-tool {
  justify-content: center !important;
  padding-left: 0 !important; padding-right: 0 !important;
  gap: 0 !important;
}
#left-sidebar:not(.tools-expanded) #lux-trading-notification-tool .tool-label,
#left-sidebar:not(.tools-expanded) #lux-trading-auto-tool .tool-label { display: none !important; }
#left-sidebar:not(.tools-expanded) .lux-trading-bell,
#left-sidebar:not(.tools-expanded) .lux-auto-icon { position: static !important; margin: 0 !important; transform: none !important; }
.lux-auto-icon {
  display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px;
  font-size: 11px; font-weight: 900; color: #1a1206; background: linear-gradient(135deg, #ffe29a, #d4af37);
}
#lux-trading-auto-tool { position: relative; }
#lux-trading-auto-tool[aria-pressed="true"]::after {
  content: ""; position: absolute; right: 5px; top: 5px; width: 7px; height: 7px; border-radius: 50%;
  background: #26a69a; box-shadow: 0 0 7px rgba(38, 166, 154, .9);
}

/* Barra de arriba: el botón del tema (fijo arriba a la derecha) tapaba "Canal WhatsApp" */
.header.lux-terminal-header-v197 { padding-right: 58px !important; }
@media (max-width: 1680px) {
  /* "Canal WhatsApp" → "WhatsApp" para que entre */
  .header .whatsapp-link .whatsapp-text { display: none !important; }
  .header .whatsapp-link::after { content: "WhatsApp"; }
}

/* Botón de gráfico dividido: con un solo gráfico se veía un recuadro vacío */
#lux-split-btn:not([data-mode="row"]):not([data-mode="col"]) .lux-split-ico::after {
  content: "+"; position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 11px; font-weight: 900; line-height: 1;
}

/* Barra de estadísticas de abajo: si no entra, se desliza en vez de cortarse */
#bottom-panel { overflow-x: auto !important; scrollbar-width: none; }
#bottom-panel::-webkit-scrollbar { display: none; }
#bottom-panel .bp-stat, #bottom-panel .bp-live { flex-shrink: 0 !important; white-space: nowrap; }

/* Watchlist: banderas dobles (EUR/USD) se salían de su lugar */
.watchlist-row .wl-symbol { min-width: 0; overflow: hidden; }
.watchlist-row .wl-symbol img, .watchlist-row .wl-logo { flex-shrink: 0; }

/* Tarjeta del par: si el logo no carga, no se ve el recuadro vacío */
.wl-detail-logo-slot img[src=""], .wl-detail-logo-slot img:not([src]) { visibility: hidden; }

/* Leyenda de indicadores sobre el gráfico: legible en tema claro y en celular */
html.light .indicator-legend, html[data-theme="light"] .indicator-legend {
  background: rgba(255, 255, 255, .88) !important; color: #1c2130 !important;
  border: 1px solid rgba(30, 30, 40, .12) !important; box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
}
html.light .indicator-legend *, html[data-theme="light"] .indicator-legend * { color: inherit; }
html.light .indicator-legend .indicator-row, html[data-theme="light"] .indicator-legend .indicator-row { color: #1c2130 !important; }
@media (max-width: 768px) {
  .indicator-legend { background: rgba(10, 13, 20, .78) !important; }
  .indicator-legend .indicator-row, .indicator-legend .indicator-row * { color: #e9edf5 !important; opacity: 1 !important; }
  html.light .indicator-legend .indicator-row, html.light .indicator-legend .indicator-row * { color: #1c2130 !important; }
}

/* Celular: el botón flotante de LUX tapaba la esquina del eje de tiempo */
@media (max-width: 768px) {
  #lux-floating-chat-btn { bottom: calc(86px + env(safe-area-inset-bottom)) !important; }
}

/* Tema claro: el título y el precio arriba del gráfico tenían una sombra pensada
   para el fondo oscuro y se veían borrosos */
html.light #top-overlay, html.light #top-overlay * { text-shadow: none !important; -webkit-text-stroke: 0 !important; }

/* Panel derecho: el subtítulo "Seguimiento, oportunidades y contexto" quedaba recortado */
div:has(> #lux-sidebar-eyebrow) { height: auto !important; max-height: none !important; overflow: visible !important; padding-bottom: 4px; }
/* Tema claro: el nombre del par arriba del gráfico salía casi blanco */
html.light #top-overlay span:not([class]):not([style*="color"]) { color: #1c2130 !important; }

/* ───── Chat de Trading: foto, hora y tarjetita al tocar el nombre (lux-trading-chat.js) ───── */
.lux-chat-msg.ltc-has-av { position: relative; margin-left: 38px; }
.lux-chat-msg .ltc-av {
  position: absolute; left: -36px; top: 0; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%;
  display: grid; place-items: center; overflow: hidden; cursor: pointer;
  font-size: 12px; font-weight: 800; color: #1a1206; background: linear-gradient(135deg, #ffe29a, #d4af37);
}
.lux-chat-msg .ltc-av img { width: 100%; height: 100%; object-fit: cover; }
.lux-chat-msg-head { align-items: baseline; }
.lux-chat-msg .ltc-name { cursor: pointer; font-weight: 700; color: #f2c35b; }
.lux-chat-msg .ltc-name:hover { text-decoration: underline; }
.lux-chat-msg .ltc-time { margin-left: auto; font-size: 10px; opacity: .55; white-space: nowrap; }
.lux-chat-msg.mine .lux-chat-msg-head { justify-content: flex-end; }
#lux-floating-chat .ltc-card {
  position: absolute; z-index: 5; width: 220px; padding: 16px 14px 14px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
  border-radius: 16px; color: #e8eaf0; background: #12161f; border: 1px solid rgba(242, 195, 91, .35); box-shadow: 0 18px 40px rgba(0, 0, 0, .55);
}
#lux-floating-chat .ltc-card > b { font-size: 14px; }
#lux-floating-chat .ltc-card small { font-size: 12px; color: #a3a8b2; }
#lux-floating-chat .ltc-card small b { color: #e8eaf0; }
#lux-floating-chat .ltc-card-x { position: absolute; top: 6px; right: 8px; border: 0; background: none; color: #a3a8b2; cursor: pointer; font-size: 13px; }
#lux-floating-chat .ltc-card-av {
  width: 64px; height: 64px; padding: 0; border-radius: 50%; overflow: hidden; display: grid; place-items: center; cursor: pointer;
  font-size: 24px; font-weight: 800; color: #1a1206; background: linear-gradient(135deg, #ffe29a, #d4af37); border: 2px solid rgba(242, 195, 91, .55);
}
#lux-floating-chat span.ltc-card-av { cursor: default; }
#lux-floating-chat .ltc-card-av img { width: 100%; height: 100%; object-fit: cover; }
#lux-floating-chat .ltc-badges { display: flex; gap: 5px; }
#lux-floating-chat .ltc-badge { padding: 2px 7px; border-radius: 999px; font-size: 10px; font-weight: 800; }
#lux-floating-chat .ltc-badge.adm { color: #67e8f9; background: rgba(34, 211, 238, .12); }
#lux-floating-chat .ltc-badge.vip { color: #1a1206; background: linear-gradient(135deg, #ffe29a, #d4af37); }
#lux-floating-chat .ltc-card-btns { display: flex; gap: 6px; margin-top: 4px; width: 100%; }
#lux-floating-chat .ltc-btn { flex: 1; padding: 7px 8px; border-radius: 10px; cursor: pointer; font-size: 12px; font-weight: 800; color: #e8eaf0; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
#lux-floating-chat .ltc-btn.gold { color: #1a1206; background: linear-gradient(135deg, #ffe29a, #d4af37); border-color: transparent; }
html.light #lux-floating-chat .ltc-card { color: #1c2130; background: #fff; }
html.light #lux-floating-chat .ltc-card small b { color: #1c2130; }
html.light #lux-floating-chat .ltc-btn:not(.gold) { color: #1c2130; background: rgba(20, 22, 30, .05); border-color: rgba(20, 22, 30, .12); }
html.light .lux-floating-chat-head strong { color: #1c2130 !important; }