/* ================================================================
   BuddyWeb — buddypress.css v1.2
   Solo se carga en páginas de BuddyPress.
   No toca nada del resto de paramiweb.com.

   COLUMNAS:
   - Actividad: 2 col desktop, 1 móvil
   - Grupos:    3 col desktop, 2 tablet (≤1024px), 1 móvil (≤768px)
   - Miembros:  3 col desktop, 2 tablet (≤1024px), 1 móvil (≤768px)

   COLORES: azul #1a2c5b | naranja #f07c00
   ================================================================ */

:root {
  --bw-azul:     #1a2c5b;
  --bw-azul2:    #2a4080;
  --bw-naranja:  #f07c00;
  --bw-link:     #2563eb;
  --bw-link-h:   #60a5fa;
  --bw-blanco:   #ffffff;
  --bw-fondo:    #f7f8fa;
  --bw-borde:    #e2e8f0;
  --bw-texto:    #1f2937;
  --bw-muted:    #6b7280;
  --bw-radio:    10px;
  --bw-radio-lg: 14px;
}

/* ── BASE ──────────────────────────────────────────────────── */
body.bw-bp { background: var(--bw-blanco); }

.bw-bp .site-content,
.bw-bp .inside-article,
.bw-bp #primary,
.bw-bp #content {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
}

#buddypress {
  width: 100%;
  padding: 1.5rem 2rem;
  box-sizing: border-box;
  font-family: system-ui, -apple-system, sans-serif;
  color: var(--bw-texto);
}

#buddypress * { box-sizing: border-box; }
#buddypress a { color: var(--bw-azul); text-decoration: none; }
#buddypress a:hover { color: var(--bw-naranja); }

/* ── FIX CRÍTICO: nav vertical BP Nouveau ─────────────────────
   Causa el hueco en Actividad y Usuarios
   ─────────────────────────────────────────────────────────── */
.bp-dir-vert-nav .dir-navs,
.bp-dir-vert-nav .bp-navs.dir-navs,
.bp-dir-vert-nav nav.dir-navs {
  float: none !important;
  width: 100% !important;
  position: static !important;
  display: block !important;
}

.bp-dir-vert-nav .dir-navs ul {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  float: none !important;
  width: 100% !important;
}

.bp-dir-vert-nav .dir-navs ul li { float: none !important; width: auto !important; }

.bp-dir-vert-nav .screen-content {
  margin-left: 0 !important;
  border-left: none !important;
  padding-left: 0 !important;
  width: 100% !important;
  float: none !important;
}

#buddypress .screen-content {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  float: none !important;
}

/* ── NAVEGACIÓN DIRECTORIOS ───────────────────────────────── */
#buddypress nav.bp-navs,
#buddypress nav.dir-navs,
#buddypress nav.main-navs,
#buddypress nav.groups-type-navs {
  margin-bottom: 1.5rem !important;
  border-bottom: 2px solid var(--bw-borde) !important;
  background: none !important;
}

#buddypress nav.bp-navs ul,
#buddypress nav.dir-navs ul,
#buddypress nav.main-navs ul,
#buddypress nav.groups-type-navs ul {
  display: flex !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 2px !important;
  border: none !important;
  background: none !important;
}

#buddypress nav.bp-navs ul li a,
#buddypress nav.dir-navs ul li a,
#buddypress nav.main-navs ul li a,
#buddypress nav.groups-type-navs ul li a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 16px !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  color: var(--bw-muted) !important;
  border-bottom: 3px solid transparent !important;
  margin-bottom: -2px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  transition: all 150ms !important;
  white-space: nowrap !important;
  background: none !important;
}

#buddypress nav.bp-navs ul li a:hover { color: var(--bw-azul) !important; border-bottom-color: var(--bw-azul) !important; }

#buddypress nav.bp-navs ul li.current a,
#buddypress nav.bp-navs ul li.selected a,
#buddypress nav.dir-navs ul li.current a,
#buddypress nav.main-navs ul li.current a,
#buddypress nav.groups-type-navs ul li.current a {
  color: var(--bw-naranja) !important;
  border-bottom-color: var(--bw-naranja) !important;
}

#buddypress nav.bp-navs ul li a span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 5px !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  background: var(--bw-azul) !important;
  color: #fff !important;
  border-radius: 9999px !important;
}

#buddypress nav.bp-navs ul li.current a span { background: var(--bw-naranja) !important; }

/* ── BUSCADOR ─────────────────────────────────────────────── */
#buddypress .bp-dir-search-form {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  max-width: 460px !important;
  margin-bottom: 1rem !important;
}

#buddypress .bp-dir-search-form label.bp-screen-reader-text {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0,0,0,0) !important;
}

#buddypress .bp-dir-search-form input[type="search"] {
  flex: 1 !important;
  min-width: 0 !important;
  height: 42px !important;
  padding: 0 14px !important;
  border: 2px solid var(--bw-borde) !important;
  border-radius: var(--bw-radio) !important;
  font-size: 0.9rem !important;
  background: var(--bw-blanco) !important;
  outline: none !important;
}

#buddypress .bp-dir-search-form input[type="search"]:focus { border-color: var(--bw-azul) !important; }

#buddypress .bp-dir-search-form button.nouveau-search-submit {
  flex: 0 0 42px !important;
  width: 42px !important; height: 42px !important;
  background: var(--bw-azul) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--bw-radio) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 150ms !important;
}

#buddypress .bp-dir-search-form button.nouveau-search-submit:hover { background: var(--bw-naranja) !important; }
#buddypress .bp-dir-search-form #button-text { display: none !important; }

/* ── FILTRO ───────────────────────────────────────────────── */
#buddypress .last.filter { display: flex !important; justify-content: flex-end !important; margin-bottom: 1rem !important; }
#buddypress .last.filter select {
  padding: 8px 14px !important;
  border: 2px solid var(--bw-borde) !important;
  border-radius: var(--bw-radio) !important;
  font-size: 0.875rem !important;
  background: var(--bw-blanco) !important;
  outline: none !important;
}

/* ── GRID GRUPOS ──────────────────────────────────────────── */
#buddypress #groups-list,
#buddypress ul.groups-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1.5rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  align-items: start !important;
}

/* ── GRID MIEMBROS ────────────────────────────────────────── */
#buddypress #members-list,
#buddypress ul.members-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1.5rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  align-items: start !important;
}

/* ── GRID ACTIVIDAD — 2 columnas ──────────────────────────── */
#buddypress ul.activity-list {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 1.25rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  align-items: start !important;
}

/* Loader y load-more */
#buddypress li#bp-ajax-loader { display: none !important; }
#buddypress li#bp-ajax-loader.loading { display: block !important; grid-column: 1 / -1 !important; text-align: center !important; padding: 2rem !important; }

#buddypress li.load-more {
  grid-column: 1 / -1 !important;
  text-align: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 1rem !important;
}

#buddypress li.load-more::before { display: none !important; }
#buddypress li.load-more a { display: inline-flex !important; padding: 10px 24px !important; background: var(--bw-azul) !important; color: #fff !important; border-radius: var(--bw-radio) !important; font-weight: 700 !important; font-size: 0.875rem !important; text-transform: uppercase !important; }
#buddypress li.load-more a:hover { background: var(--bw-naranja) !important; }

/* ── CARD ─────────────────────────────────────────────────── */
#buddypress li.item-entry,
#buddypress li.item-entry .list-wrap,
#buddypress li.item-entry .item-avatar,
#buddypress li.item-entry .item { float: none !important; clear: none !important; width: auto !important; }

#buddypress li.item-entry {
  background: var(--bw-fondo) !important;
  border: 1px solid var(--bw-borde) !important;
  border-radius: var(--bw-radio-lg) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
  transition: box-shadow 160ms, transform 160ms !important;
}

#buddypress li.item-entry:hover { box-shadow: 0 6px 24px rgba(26,44,91,.13) !important; transform: translateY(-3px) !important; }

#buddypress li.item-entry::before {
  content: '' !important; display: block !important;
  height: 3px !important; background: var(--bw-naranja) !important;
  width: 0 !important; transition: width 240ms !important;
  position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important;
}

#buddypress li.item-entry:hover::before { width: 100% !important; }

#buddypress li.item-entry .list-wrap { display: flex !important; flex-direction: column !important; align-items: center !important; width: 100% !important; }

#buddypress li.item-entry .item-avatar { padding: 1.5rem 1.5rem 0 !important; text-align: center !important; width: 100% !important; }
#buddypress li.item-entry .item-avatar a { display: inline-block !important; }
#buddypress li.item-entry .item-avatar img { width: 80px !important; height: 80px !important; border-radius: 50% !important; object-fit: cover !important; display: block !important; margin: 0 auto !important; border: none !important; }

#buddypress li.item-entry .item { flex: 1 !important; padding: 1rem 1.25rem 1.25rem !important; text-align: center !important; width: 100% !important; word-break: break-word !important; }

#buddypress li.item-entry h2.list-title,
#buddypress li.item-entry .list-title { font-size: 1rem !important; font-weight: 700 !important; color: var(--bw-azul) !important; margin: 0 0 0.5rem !important; line-height: 1.3 !important; }

#buddypress li.item-entry h2.list-title a { color: var(--bw-azul) !important; }
#buddypress li.item-entry h2.list-title a:hover { color: var(--bw-naranja) !important; }

#buddypress li.item-entry p.item-meta { font-size: 0.85rem !important; color: var(--bw-muted) !important; margin: 0 0 0.2rem !important; float: none !important; width: 100% !important; }

#buddypress li.item-entry .group-desc p { font-size: 0.85rem !important; color: var(--bw-muted) !important; font-style: italic !important; margin: 0.5rem 0 0 !important; overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; }

#buddypress li.item-entry .action { padding: 0.75rem 1rem !important; border-top: 1px solid var(--bw-borde) !important; background: var(--bw-blanco) !important; display: flex !important; justify-content: center !important; gap: 8px !important; flex-wrap: wrap !important; float: none !important; width: 100% !important; margin: auto 0 0 !important; }

/* ── ACTIVIDAD: contenedor ────────────────────────────────── */
#buddypress #activity-stream { display: block !important; width: 100% !important; float: none !important; padding: 0 !important; margin: 0 !important; }

/* ── ITEM DE ACTIVIDAD ────────────────────────────────────── */
#buddypress li.activity-item {
  background: var(--bw-fondo) !important;
  border: 1px solid var(--bw-borde) !important;
  border-radius: var(--bw-radio-lg) !important;
  overflow: hidden !important;
  width: 100% !important;
  float: none !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  position: relative !important;
}

#buddypress li.activity-item::before {
  content: '' !important; display: block !important;
  height: 3px !important; background: var(--bw-naranja) !important;
  width: 0 !important; transition: width 240ms !important;
  position: absolute !important; top: 0 !important; left: 0 !important;
  z-index: 1 !important;
}

#buddypress li.activity-item:hover { border-color: var(--bw-azul) !important; }
#buddypress li.activity-item:hover::before { width: 100% !important; }

/* Ocultar avatar — el avatar queda en display:none pero
   NO puede dejar espacio lateral. Usamos flex en el li padre. */
#buddypress li.activity-item > .activity-avatar,
#buddypress li.activity-item > div.activity-avatar {
  display: none !important;
  width: 0 !important; height: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  pointer-events: none !important;
}

/* activity-content ocupa el 100% gracias a flex del padre */
#buddypress li.activity-item > .activity-content {
  flex: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  float: none !important;
}

/* Cabecera */
#buddypress li.activity-item .activity-header {
  width: 100% !important;
  padding: 0.875rem 1.25rem !important;
  background: var(--bw-blanco) !important;
  border-bottom: 1px solid var(--bw-borde) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
}

#buddypress li.activity-item .activity-header p { margin: 0 !important; color: var(--bw-muted) !important; font-size: 0.875rem !important; line-height: 1.5 !important; }
#buddypress li.activity-item .activity-header p a { font-weight: 700 !important; color: var(--bw-azul) !important; }
#buddypress li.activity-item .activity-header p a:hover { color: var(--bw-naranja) !important; }

/* ── IMAGEN DESTACADA: primera imagen ancho completo ─────────
   La primera img ocupa todo el ancho de la card,
   centrada, justo debajo del header, sin padding lateral.
   ─────────────────────────────────────────────────────────── */
#buddypress li.activity-item .activity-inner {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;         /* sin padding — la imagen llega al borde */
  font-size: 0.95rem !important;
  color: var(--bw-texto) !important;
  line-height: 1.7 !important;
  background: var(--bw-fondo) !important;
  box-sizing: border-box !important;
  float: none !important;
  overflow: hidden !important;
}

/* Texto y otros elementos con padding */
#buddypress li.activity-item .activity-inner > p,
#buddypress li.activity-item .activity-inner > div,
#buddypress li.activity-item .activity-inner > ul,
#buddypress li.activity-item .activity-inner > ol,
#buddypress li.activity-item .activity-inner > blockquote {
  padding: 1rem 1.25rem !important;
  margin: 0 !important;
}

/* Primera imagen: ancho completo, sin radio, pegada al header */
#buddypress li.activity-item .activity-inner img:first-of-type {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 400px !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: 0 !important;
  border-radius: 0 !important;
  float: none !important;
}

/* Imágenes siguientes: centradas con padding */
#buddypress li.activity-item .activity-inner img:not(:first-of-type) {
  display: block !important;
  max-width: calc(100% - 2.5rem) !important;
  height: auto !important;
  margin: 0.75rem auto !important;
  border-radius: var(--bw-radio) !important;
  float: none !important;
}

/* Meta acciones */
#buddypress li.activity-item .activity-meta {
  width: 100% !important;
  padding: 0.625rem 1.25rem !important;
  border-top: 1px solid var(--bw-borde) !important;
  background: var(--bw-blanco) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
  margin-top: auto !important;
}

#buddypress li.activity-item .activity-meta a {
  font-size: 0.78rem !important; font-weight: 700 !important;
  color: var(--bw-muted) !important;
  padding: 4px 10px !important;
  border: 1.5px solid var(--bw-borde) !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  transition: all 150ms !important;
  background: var(--bw-blanco) !important;
}

#buddypress li.activity-item .activity-meta a:hover { background: var(--bw-azul) !important; color: #fff !important; border-color: var(--bw-azul) !important; }

#buddypress li.activity-item .activity-comments { width: 100% !important; margin: 0 !important; padding: 0 !important; float: none !important; }

/* ── ENLACES EN TEXTOS DE ACTIVIDAD ──────────────────────── */
#buddypress li.activity-item .activity-inner a,
#buddypress li.activity-item .activity-content a:not(.button):not(.bp-tooltip) {
  color: var(--bw-link) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  transition: color 150ms !important;
}

#buddypress li.activity-item .activity-inner a:hover,
#buddypress li.activity-item .activity-content a:not(.button):not(.bp-tooltip):hover {
  color: var(--bw-link-h) !important;
}

/* ── CARRUSEL DE IMÁGENES (plugin Telegram) ───────────────── */
#buddypress .activity-inner .wp-block-gallery,
#buddypress .activity-inner .gallery,
#buddypress .activity-inner .bw-carousel,
#buddypress .activity-inner .telegram-carousel {
  display: flex !important;
  flex-direction: row !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
  gap: 8px !important;
  padding: 1rem 1.25rem !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--bw-azul) var(--bw-borde) !important;
}

#buddypress .activity-inner .wp-block-gallery img,
#buddypress .activity-inner .gallery img,
#buddypress .activity-inner .gallery-item img,
#buddypress .activity-inner .bw-carousel img,
#buddypress .activity-inner .telegram-carousel img {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 80% !important;
  height: 220px !important;
  object-fit: cover !important;
  border-radius: var(--bw-radio) !important;
  scroll-snap-align: start !important;
  display: block !important;
  float: none !important;
  margin: 0 !important;
}

/* Scrollbar carrusel */
#buddypress .activity-inner .wp-block-gallery::-webkit-scrollbar,
#buddypress .activity-inner .gallery::-webkit-scrollbar { height: 4px !important; }
#buddypress .activity-inner .wp-block-gallery::-webkit-scrollbar-thumb,
#buddypress .activity-inner .gallery::-webkit-scrollbar-thumb { background: var(--bw-azul) !important; border-radius: 4px !important; }

/* ── VÍDEOS ───────────────────────────────────────────────── */
#buddypress .activity-inner .wp-block-embed,
#buddypress .activity-inner .embed-responsive,
#buddypress .activity-inner .video-wrapper,
#buddypress .activity-inner .telegram-video {
  position: relative !important;
  width: 100% !important;
  padding-bottom: 56.25% !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  background: #000 !important;
}

#buddypress .activity-inner .wp-block-embed iframe,
#buddypress .activity-inner .embed-responsive iframe,
#buddypress .activity-inner .video-wrapper iframe,
#buddypress .activity-inner .telegram-video iframe,
#buddypress .activity-inner video {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  border: none !important;
}

#buddypress .activity-inner > video {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

#buddypress .activity-inner > iframe {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  border: none !important;
  margin: 0 !important;
}

/* ── VISTA DETALLE ────────────────────────────────────────── */
body.activity-permalink #buddypress ul.activity-list { display: block !important; max-width: 1440px !important; margin: 0 auto !important; }
body.activity-permalink #buddypress li.activity-item { width: 100% !important; }

/* ── CABECERA GRUPO/PERFIL ────────────────────────────────── */
#buddypress #item-header { background: var(--bw-blanco); border: 1px solid var(--bw-borde); border-radius: var(--bw-radio-lg); overflow: visible !important; margin-bottom: 1.5rem; }

#buddypress #cover-image-container { position: relative !important; width: 100% !important; height: 225px !important; overflow: hidden !important; border-radius: var(--bw-radio-lg) var(--bw-radio-lg) 0 0 !important; background: linear-gradient(135deg, var(--bw-azul) 0%, var(--bw-azul2) 100%) !important; }

#buddypress #header-cover-image { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; background-size: cover !important; background-position: center !important; z-index: 1 !important; }

#buddypress #item-header-cover-image { position: relative !important; z-index: 2 !important; display: flex !important; align-items: flex-end !important; padding: 0 2rem 1.5rem !important; height: 100% !important; background: linear-gradient(to top, rgba(0,0,0,.5) 0%, transparent 60%) !important; }

#buddypress #item-header-cover-image #item-header-avatar { flex-shrink: 0 !important; padding: 0 !important; margin: 0 1.5rem 0 0 !important; float: none !important; width: auto !important; }
#buddypress #item-header-cover-image #item-header-avatar img { width: 90px !important; height: 90px !important; border-radius: var(--bw-radio) !important; border: 3px solid #fff !important; object-fit: cover !important; display: block !important; }

#buddypress #item-header-cover-image #item-header-content { color: #fff !important; padding: 0 !important; float: none !important; width: auto !important; }
#buddypress #item-header-cover-image #item-header-content h2 { color: #fff !important; font-size: 1.5rem !important; font-weight: 800 !important; margin: 0 0 0.25rem !important; text-shadow: 0 1px 3px rgba(0,0,0,.4) !important; }
#buddypress #item-header-cover-image #item-header-content .activity { color: rgba(255,255,255,.85) !important; font-size: 0.875rem !important; margin: 0 !important; }

/* ── NAV PERFIL/GRUPO ─────────────────────────────────────── */
#buddypress #object-nav { margin-bottom: 1.5rem !important; overflow-x: auto !important; border-bottom: 2px solid var(--bw-borde) !important; }
#buddypress #object-nav ul { display: flex !important; list-style: none !important; margin: 0 !important; padding: 0 !important; min-width: max-content !important; }
#buddypress #object-nav ul li a { display: block !important; padding: 12px 18px !important; font-size: 0.8125rem !important; font-weight: 700 !important; color: var(--bw-muted) !important; border-bottom: 3px solid transparent !important; text-transform: uppercase !important; white-space: nowrap !important; transition: all 150ms !important; }
#buddypress #object-nav ul li a:hover { color: var(--bw-azul) !important; border-bottom-color: var(--bw-azul) !important; }
#buddypress #object-nav ul li.current a { color: var(--bw-naranja) !important; border-bottom-color: var(--bw-naranja) !important; }

/* ── BOTONES ──────────────────────────────────────────────── */
#buddypress a.button,
#buddypress button.button,
#buddypress input[type="submit"] {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  padding: 9px 20px !important; border-radius: var(--bw-radio) !important;
  font-size: 0.875rem !important; font-weight: 700 !important;
  border: 2px solid var(--bw-azul) !important;
  background: var(--bw-azul) !important; color: #fff !important;
  text-transform: uppercase !important; cursor: pointer !important; transition: all 150ms !important;
}

#buddypress a.button:hover,
#buddypress input[type="submit"]:hover { background: var(--bw-naranja) !important; border-color: var(--bw-naranja) !important; }

/* ── ANIMACIONES ──────────────────────────────────────────── */
@keyframes bw-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
#buddypress li.item-entry.bw-revealed,
#buddypress li.activity-item.bw-revealed { animation: bw-in 220ms ease both; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media screen and (min-width: 601px) and (max-width: 1024px) {
  #buddypress #groups-list,
  #buddypress ul.groups-list,
  #buddypress #members-list,
  #buddypress ul.members-list { grid-template-columns: repeat(2, 1fr) !important; }
}

@media screen and (max-width: 768px) {
  body #buddypress #groups-list,
  body #buddypress ul.groups-list,
  body #buddypress #members-list,
  body #buddypress ul.members-list,
  body #buddypress ul.activity-list { grid-template-columns: 1fr !important; gap: 1rem !important; }

  body #buddypress { padding: 1rem !important; }

  body #buddypress li.item-entry,
  body #buddypress li.activity-item { word-break: break-word !important; min-width: 0 !important; }

  #buddypress .activity-inner .wp-block-gallery img,
  #buddypress .activity-inner .gallery img { height: 160px !important; max-width: 90% !important; }
}

@media screen and (max-width: 480px) {
  body #buddypress #groups-list,
  body #buddypress ul.groups-list,
  body #buddypress #members-list,
  body #buddypress ul.members-list,
  body #buddypress ul.activity-list { grid-template-columns: 1fr !important; }
}

/* ================================================================
   BuddyWeb v1.3 — CORRECCIONES
   ================================================================ */

/* ── FIX 3: Grid actividad rompe a 1 columna a partir de fila 5
   BP Nouveau inyecta elementos que sacan al grid de su flujo.
   Forzar que TODOS los hijos del grid sean grid items correctos.
   ─────────────────────────────────────────────────────────── */
#buddypress ul.activity-list > li {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  clear: none !important;
  margin: 0 !important;
  min-width: 0 !important;
}

/* ── FIX 4: "Leer más" debe ir a la vista detalle, no desplegar
   Desactivar el comportamiento AJAX de BP para el botón read-more
   redirigiéndolo a su href directamente.
   ─────────────────────────────────────────────────────────── */
/* (se resuelve en JS — ver buddypress.js) */

/* ── FIX 5: Imagen destacada centrada, no a la izquierda
   El problema es que BP envuelve la imagen en un <p> con float.
   Necesitamos neutralizar todos los floats dentro de activity-inner.
   ─────────────────────────────────────────────────────────── */
#buddypress li.activity-item .activity-inner * {
  float: none !important;
  clear: none !important;
}

#buddypress li.activity-item .activity-inner p {
  margin: 0 !important;
  padding: 0.75rem 1.25rem !important;
}

/* Primer párrafo que contiene una imagen — sin padding lateral */
#buddypress li.activity-item .activity-inner p:has(> img:first-child) {
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  font-size: 0 !important;
}

/* La imagen dentro del primer párrafo */
#buddypress li.activity-item .activity-inner p:has(> img:first-child) img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 400px !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin: 0 auto !important;
  float: none !important;
  border-radius: 0 !important;
}

/* Primera imagen directa sin párrafo envolvente */
#buddypress li.activity-item .activity-inner > img:first-child {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 400px !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin: 0 !important;
  float: none !important;
  border-radius: 0 !important;
}

/* ── FIX 6: Eliminar foto de perfil y texto del administrador
   en la portada del grupo (sección #item-header-content)
   ─────────────────────────────────────────────────────────── */

/* Ocultar "Administradores del grupo" + avatar del admin */
#buddypress #item-header .group-admins,
#buddypress #item-header .group-mods,
#buddypress #item-header #item-header-content .group-admins,
#buddypress #item-header #item-header-content p.group-admins,
#buddypress #item-header-cover-image .group-admins,
#buddypress #item-header-cover-image .group-mods {
  display: none !important;
}

/* Ocultar el bloque de administradores que BP pone fuera del cover */
#buddypress #item-header #item-header-content > p:last-of-type,
#buddypress #item-header #item-header-content .highlight.group-admins {
  display: none !important;
}

/* Ocultar cualquier avatar de admin/mod en la cabecera del grupo */
#buddypress #item-header .avatar-list,
#buddypress #item-header ul.item-list.avatars {
  display: none !important;
}

/* ── FIX: Foto y texto admin en portada de grupo ─────────────
   Selectores más específicos para cubrir todas las variantes
   ─────────────────────────────────────────────────────────── */
#buddypress #item-header .group-admins,
#buddypress #item-header .group-mods,
#buddypress #item-header-cover-image .group-admins,
#buddypress #item-header-cover-image .group-mods,
#buddypress #item-header-content .group-admins,
#buddypress #item-header-content .group-mods,
#buddypress #item-header ul.group-admins,
#buddypress #item-header ul.group-mods,
#buddypress #item-header p.group-admins,
#buddypress #item-header p.group-mods,
#buddypress #item-header div.group-admins,
#buddypress #item-header div.group-mods,
#buddypress #item-header .avatar-list,
#buddypress #item-header ul.item-list.avatars,
#buddypress #item-header .moderators-lists,
#buddypress #item-header .highlight.group-status { display: none !important; }

/* Ocultar cualquier párrafo dentro de item-header-content
   que contenga un enlace a un perfil de usuario (el admin) */
#buddypress #item-header-content p:has(a[href*="/usuarios/"]) { display: none !important; }
#buddypress #item-header-content ul:has(a[href*="/usuarios/"]) { display: none !important; }

/* ── FIX: Leer más — evitar que BP recargue con AJAX ─────────
   BP escucha el evento click en .activity-item y hace AJAX.
   Necesitamos que "Leer más" navegue directamente a la URL.
   Se maneja en JS pero añadimos pointer-events como respaldo.
   ─────────────────────────────────────────────────────────── */
#buddypress .activity-item .activity-read-more { pointer-events: none !important; }
#buddypress .activity-item .activity-read-more a { pointer-events: all !important; }

/* ── FIX: Imagen completa sin recorte ────────────────────────
   Cambiamos object-fit de cover a contain para mostrar
   la imagen completa sin recortar. Fondo negro para las
   zonas vacías si la imagen no es cuadrada.
   ─────────────────────────────────────────────────────────── */

/* Primera imagen en cards de actividad — sin recorte */
#buddypress li.activity-item .activity-inner img:first-of-type,
#buddypress li.activity-item .activity-inner p:first-of-type img {
  object-fit: contain !important;
  object-position: center center !important;
  max-height: none !important;        /* sin límite de altura */
  height: auto !important;
  background: var(--bw-fondo) !important;  /* fondo neutro si hay espacio */
}

/* Vista detalle de actividad — imagen completa */
body.activity-permalink #buddypress li.activity-item .activity-inner img {
  object-fit: contain !important;
  max-height: none !important;
  height: auto !important;
  width: 100% !important;
  background: var(--bw-fondo) !important;
}

/* ── FIX DEFINITIVO: hueco primera celda ─────────────────────
   El problema NO es un li vacío. Es que BP Nouveau aplica
   grid-column-start al primer li, empujándolo a la col 2.
   También el ::before del ul ocupa espacio en el grid.
   ─────────────────────────────────────────────────────────── */

/* Eliminar el ::before del ul que ocupa una celda del grid */
#buddypress #groups-list::before,
#buddypress ul.groups-list::before,
#buddypress #members-list::before,
#buddypress ul.members-list::before,
#buddypress ul.activity-list::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Forzar que el primer li siempre empiece en columna 1 */
#buddypress #groups-list > li:first-child,
#buddypress ul.groups-list > li:first-child,
#buddypress #members-list > li:first-child,
#buddypress ul.members-list > li:first-child,
#buddypress ul.activity-list > li:first-child {
  grid-column-start: 1 !important;
  grid-column-end: auto !important;
}

/* Todos los li del grid empiezan en auto (sin saltar columnas) */
#buddypress #groups-list > li,
#buddypress ul.groups-list > li,
#buddypress #members-list > li,
#buddypress ul.members-list > li {
  grid-column: auto !important;
  grid-row: auto !important;
}
