/* lussyca_brand_ui.css — coherencia visual SFW (logo, botones, modo claro)
   Versión: 20260629-quality-audit */

/* ══ Modo claro — paleta cálida distinta del oscuro ══ */
html[data-theme="light"],
html[data-theme="light"] body {
  --bg-deep:   #f0ebe5;
  --bg-base:   #ffffff;
  --bg-card:   #faf7f4;
  --bg-hover:  #f3ede6;
  --bg-soft:   #e8e2db;
  --paper:     #1a1520;
  --text:       #1a1520;
  --text-muted: #5c5268;
  --text-faint: #8a8098;
  --border:       rgba(30, 20, 40, 0.12);
  --border-light: rgba(30, 20, 40, 0.06);
  --shadow-elev:  0 4px 20px rgba(30, 10, 20, 0.08);
  --grad-hdr: rgba(255, 252, 250, 0.97);
  --grad-tabs: #ffffff;
  --wa-chat-bg: #e5ddd5;
  --grad-msg-user: linear-gradient(135deg, #dcf8c6, #c5f0a8);
  --grad-msg-bot:  #ffffff;
  --menu-bg: #ffffff;
  --menu-border: rgba(30, 20, 40, 0.1);
  --menu-text: #1a1520;
  --menu-hover: rgba(240, 90, 138, 0.08);
  --hdr-icon: #5c5268;
  --pro-bg: #f0ebe5;
  --pro-surface: #ffffff;
  --pro-surface-2: #faf7f4;
  --pro-text: #1a1520;
  --pro-muted: #5c5268;
  --pro-border: rgba(30, 20, 40, 0.1);
  --pro-accent: #d63d7a;
}

html[data-theme="light"] body {
  background: var(--bg-deep);
  color: var(--text);
}

html[data-theme="light"] #wa-list-pane,
html[data-theme="light"] #wa-chat-list,
html[data-theme="light"] .wa-chat-row {
  background: var(--bg-base) !important;
  color: var(--text) !important;
}

html[data-theme="light"] .chat-panel { background: var(--bg-base); }
html[data-theme="light"] .chat-hdr {
  background: var(--grad-hdr);
  border-bottom-color: var(--border);
}
html[data-theme="light"] .chat-msgs { background: var(--wa-chat-bg); }
html[data-theme="light"] .msg.bot {
  background: #fff !important;
  color: #1a1520 !important;
  box-shadow: 0 1px 3px rgba(30, 10, 20, 0.08) !important;
}
html[data-theme="light"] .msg.user {
  background: #dcf8c6 !important;
  color: #1a1520 !important;
}
html[data-theme="light"] .chat-inp {
  background: var(--bg-base);
  border-top-color: var(--border);
}
html[data-theme="light"] .chat-inp textarea {
  background: var(--bg-card);
  color: var(--text);
}
html[data-theme="light"] #lussyca-topnav {
  background: rgba(255, 252, 250, 0.96) !important;
  border-bottom: 1px solid var(--border) !important;
}
html[data-theme="light"] .topnav-link { color: var(--text-muted) !important; }
html[data-theme="light"] .topnav-link.active { color: var(--pro-accent) !important; }
html[data-theme="light"] .act-btn {
  background: var(--bg-card);
  border-color: var(--border);
  color: var(--text-muted);
}
html[data-theme="light"] #profile-panel {
  background: var(--bg-base);
  color: var(--text);
}
html[data-theme="light"] .profile-tab { color: var(--text-muted); }
html[data-theme="light"] .profile-tab.active { color: var(--pro-accent); }

/* ══ Botones — contraste WCAG AA ══ */
.btn-primary, .gate-btn-primary, .ctx-btn-primary, .lussyca-promo-cta,
.chat-inp .send-btn, .group-send-btn, .grupos-wiz-next {
  background: var(--btn-premium-bg, linear-gradient(135deg, #c43060, #8B5CF6)) !important;
  color: var(--btn-premium-fg, #ffffff) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.btn-secondary, .gate-btn-secondary {
  background: var(--btn-secondary-bg) !important;
  color: var(--btn-secondary-fg) !important;
  border: 1px solid var(--btn-secondary-border) !important;
}
.act-btn, .ln-btn-outline {
  background: var(--act-btn-bg) !important;
  color: var(--act-btn-fg) !important;
  border-color: var(--act-btn-border) !important;
}
.act-btn:hover {
  background: var(--act-btn-hover-bg) !important;
  color: var(--act-btn-hover-fg) !important;
}

/* Barra inferior móvil — nunca blanca en oscuro */
#lussyca-bottom-nav {
  background: var(--nav-bar-bg) !important;
  border-top: 1px solid var(--nav-bar-border) !important;
}
#lussyca-bottom-nav button {
  color: var(--text-muted) !important;
  background: transparent !important;
}
#lussyca-bottom-nav button.active {
  color: var(--rose-light) !important;
  background: rgba(240, 90, 138, 0.14) !important;
}

/* Input inferior del chat */
.chat-inp {
  background: var(--inp-bar-bg) !important;
  border-top-color: var(--inp-bar-border, var(--border)) !important;
}
.chat-inp textarea {
  background: var(--inp-field-bg) !important;
  color: var(--inp-field-fg, var(--text)) !important;
}
.chat-inp textarea:focus {
  background: var(--inp-field-focus) !important;
}

html[data-theme="light"] #lussyca-bottom-nav {
  background: var(--nav-bar-bg) !important;
}

.ln-logo-img,
.ln-age-logo,
.topnav-logo-img,
.wa-brand-wordmark,
.wa-welcome-logo,
#lussyca-topnav .topnav-logo-img {
  opacity: 1 !important;
  visibility: visible !important;
  filter: drop-shadow(0 2px 10px rgba(180, 110, 70, 0.45)) saturate(1.15) !important;
}

.topnav-logo-btn .lussyca-logo-shine::before,
.topnav-logo-btn .lussyca-logo-shine::after,
.ln-header .lussyca-logo-shine::before,
.ln-header .lussyca-logo-shine::after {
  display: none !important;
  opacity: 0 !important;
}

/* ══ Botones nativos — quitar gris del navegador ══ */
#lussyca-topnav button,
.ln-header-actions button,
.ln-header-actions .ln-btn,
.topnav-logo-btn,
.topnav-link,
.topnav-account-btn,
.profile-tab,
.wa-icon-btn,
.gate-btn {
  -webkit-appearance: none;
  appearance: none;
  font-family: var(--font-body);
}

#lussyca-topnav .topnav-link,
#lussyca-topnav .topnav-logo-btn {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--pro-muted, var(--text-muted)) !important;
}

#lussyca-topnav .topnav-link:hover {
  background: rgba(240, 90, 138, 0.08) !important;
  color: var(--pro-text, var(--text)) !important;
}

#lussyca-topnav .topnav-link.active {
  color: var(--pro-accent, var(--rose)) !important;
}

.ln-header-actions .ln-btn {
  border-radius: 999px;
}

.ln-header-actions .ln-btn-ghost,
.ln-header-actions .ln-btn-outline {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="light"] .ln-header-actions .ln-btn-ghost,
html[data-theme="light"] .ln-header-actions .ln-btn-outline {
  border-color: var(--border) !important;
  color: var(--text) !important;
}

/* Perfil — toda la celda clicable */
.profile-photo-cell:not(.locked) {
  cursor: pointer;
}
.profile-photo-cell:not(.locked) img {
  pointer-events: none;
}

/* Lightbox vídeo */
#lightbox-video {
  display: none;
  max-width: min(96vw, 900px);
  max-height: 88vh;
  border-radius: 8px;
  background: #000;
}
#lightbox.show.has-video #lightbox-img { display: none; }
#lightbox.show.has-video #lightbox-video { display: block; }
#lightbox.show.has-image #lightbox-video { display: none; }
#lightbox.show.has-image #lightbox-img { display: block; }

/* Creador SFW — modal visible en ambos temas */
#sfw-creator-modal.irene-modal.show { display: flex !important; }
html[data-theme="light"] .sfw-creator-card {
  background: var(--bg-card);
  color: var(--text);
  border-color: var(--border);
}
html[data-theme="light"] .sfw-creator-label input {
  background: var(--bg-base);
  border-color: var(--border);
  color: var(--text);
}