/*
============================================================
TheriansHub — buddypress.css
Overrides de chrome para vistas internas de BuddyPress (perfiles, grupos,
activity, directorios). Se encola solo cuando is_buddypress() (ver
inc/enqueue.php). Todo cuelga de body.th-bp-internal (clase añadida en
inc/helpers.php, Tarea 1 del Bloque 5).
============================================================
*/

/* ---------- Tarea 2: ocultar el header de Astra en vistas BP ----------
   Las vistas BP tendrán su propio header (Tarea 3). Aquí ocultamos el de
   Astra (la barra del menú azul) con la MISMA técnica probada en la home.
   Solo afecta a body.th-bp-internal; el resto del sitio lo conserva. */
body.th-bp-internal .ast-site-header,
body.th-bp-internal .site-header,
body.th-bp-internal #masthead {
  display: none;
}

/* ---------- Tarea 5: shell de navegación (menú lateral) en vistas BP ----------
   inc/bp-shell.php envuelve el #content de Astra en <div class="th-bp-shell"> e
   inyecta el sidebar (.th-feed-nav, reutilizado de feed.css). Aquí montamos el
   grid de 2 columnas (nav + contenido BP) y neutralizamos el ancho del
   contenedor de Astra para que el contenido llene su columna.

   Móvil (base): una sola columna. El sidebar (.th-feed-nav) ya está display:none
   en móvil por feed.css; el topbar/bottom-nav móviles llegan en la Tarea 8.
   El contenido BP (pestañas incluidas) NO se toca aquí — solo el contenedor. */

/* Neutraliza el ancho/padding del contenedor de Astra dentro del shell para que
   el contenido BP ocupe toda su columna (Astra ya va sin su sidebar vía el
   filtro astra_page_layout → 'no-sidebar' en inc/bp-shell.php). */
body.th-bp-internal #content .ast-container {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* Desktop: grid de 2 columnas — nav lateral + contenido BP "que respira". */
@media (min-width: 1024px) {
  body.th-bp-internal .th-bp-shell {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 var(--space-6, 24px);
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: var(--space-8, 32px); /* aire entre menú lateral y contenido (T7) */
    align-items: start;
  }
}

/* Páginas WP del shell (Top Therians, futuras Community Rules/About…): el
   contenido va en .entry-content/article de Astra, que conserva un content-width
   estrecho dentro de la columna central. Lo soltamos para que llene la columna.
   Acotado a body.th-shell-page → no afecta a /community/ ni a las vistas BP
   (que no llevan esta clase ni usan .entry-content). */
body.th-shell-page .entry-content,
body.th-shell-page article.ast-article-single {
  max-width: none;
  width: 100%;
}

/* ---------- Tarea 6: pestañas de BuddyPress (bp-legacy) — estilo subrayado ----------
   Nav principal (#object-nav) y subnav (#subnav) de las vistas de miembro.
   Todo scopeado a body.th-bp-internal #buddypress (especificidad 1,3,5) para
   vencer a bp-legacy (1,2,4) sin !important. Colores con tokens semánticos →
   funciona en claro y oscuro. La pestaña activa = texto claro + subrayado verde. */

/* Barra: floats → flex; baseline con borde inferior sutil. */
body.th-bp-internal #buddypress div.item-list-tabs {
  overflow: visible;
}
body.th-bp-internal #buddypress div.item-list-tabs ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--color-border);
}
/* float:left/right de bp-legacy anulado (y un ul flex ya ignora floats). */
body.th-bp-internal #buddypress div.item-list-tabs ul li {
  float: none;
  margin: 0;
  list-style: none;
}

/* Enlace en reposo: texto muted, subrayado transparente. */
body.th-bp-internal #buddypress div.item-list-tabs ul li a {
  display: block;
  padding: var(--space-3) var(--space-4);
  color: var(--color-text-muted);
  font-weight: 600;
  font-size: 0.9375rem;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px; /* el subrayado se apoya en la baseline de la barra */
  transition: color var(--duration-fast) var(--ease),
              border-color var(--duration-fast) var(--ease);
}
body.th-bp-internal #buddypress div.item-list-tabs ul li a:hover {
  color: var(--color-text);
}

/* Activa: texto CLARO + subrayado verde (anula el gris #eee de bp-legacy). */
body.th-bp-internal #buddypress div.item-list-tabs ul li.current a,
body.th-bp-internal #buddypress div.item-list-tabs ul li.selected a {
  color: var(--color-text);
  background: transparent;
  opacity: 1;
  border-bottom-color: var(--color-brand);
}

/* Contador: mini-pastilla verde en vez del circulito gris. */
body.th-bp-internal #buddypress div.item-list-tabs ul li a span {
  background: var(--color-brand-soft);
  color: var(--color-brand);
  border: none;
  border-radius: var(--radius-full);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 1px 7px;
  margin-left: 6px;
  vertical-align: middle;
}

/* Subnav (Personal/Mentions/…): más compacto y pequeño. */
body.th-bp-internal #buddypress div.item-list-tabs#subnav {
  margin: var(--space-4) 0 0;
  overflow: visible;
}
body.th-bp-internal #buddypress div.item-list-tabs#subnav ul li a {
  padding: var(--space-2) var(--space-3);
  font-size: 0.8125rem;
}

/* ==========================================================================
   UI de subida de avatar/portada (BuddyPress plupload + Backbone + Jcrop).
   Nunca la estilamos → salía con defaults claros sobre el tema oscuro. La
   adaptamos a la paleta y hacemos PROMINENTE el botón de confirmar (Crop/Upload).
   Solo aparece en change-avatar / change-cover-image (markup .bp-avatar /
   .bp-cover-image), así que es inerte en el resto de vistas BP. Solo tokens.
   ========================================================================== */

/* ----- 1. Contenedores / dropzone + títulos ----- */
body.th-bp-internal #buddypress .bp-avatar,
body.th-bp-internal #buddypress .bp-cover-image,
body.th-bp-internal #buddypress #avatar-upload-form {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: var(--space-4);
	color: var(--color-text);
}
body.th-bp-internal #buddypress #avatar-upload-form h5,
body.th-bp-internal #buddypress .bp-avatar h4,
body.th-bp-internal #buddypress .bp-cover-image h4 {
	color: var(--color-text);
}
body.th-bp-internal #buddypress #avatar-upload-form p {
	color: var(--color-text-muted);
}

/* ----- 2. Pestañas (Upload / Recycle…) ----- */
body.th-bp-internal #buddypress .bp-avatar-nav {
	border-bottom: 1px solid var(--color-border);
	margin-bottom: var(--space-4);
}
body.th-bp-internal #buddypress .bp-avatar-nav .avatar-nav-item a {
	color: var(--color-text-muted);
	border-bottom: 2px solid transparent;
	padding: var(--space-2) var(--space-3);
	text-decoration: none;
	font-weight: 600;
}
body.th-bp-internal #buddypress .bp-avatar-nav .avatar-nav-item a:hover {
	color: var(--color-text);
}
body.th-bp-internal #buddypress .bp-avatar-nav .avatar-nav-item.current a {
	color: var(--color-brand);
	border-bottom-color: var(--color-brand);
}

/* ----- 3. Recorte (Jcrop) — OSCURO PERO USABLE -----
   Solo oscurecemos el contenedor; NO tocamos .jcrop-holder ni la <img> ni los
   handles/líneas de selección, para que la imagen y el marco sigan visibles. */
body.th-bp-internal #buddypress .avatar-crop-management {
	background: var(--color-surface-2);
	border-radius: var(--radius-md);
	padding: var(--space-3);
}
body.th-bp-internal #buddypress .avatar-crop-preview {
	border: 2px solid var(--color-border);
	border-radius: 50%;
}

/* ----- 4. BOTÓN CONFIRMAR (lo importante): verde sólido y prominente ----- */
body.th-bp-internal #buddypress #avatar-upload-form #upload,
body.th-bp-internal #buddypress #avatar-upload-form #avatar-crop-submit,
body.th-bp-internal #buddypress .avatar-crop-submit,
body.th-bp-internal #buddypress .bp-avatar input[type="submit"],
body.th-bp-internal #buddypress .bp-cover-image input[type="submit"],
body.th-bp-internal #buddypress .standard-form button[type="submit"],
body.th-bp-internal #buddypress .standard-form input[type="submit"] {
	background: var(--color-brand);
	color: #fff;
	border: 1px solid var(--color-brand);
	border-radius: var(--radius-full);
	padding: var(--space-3) var(--space-5);
	font-weight: 700;
	font-size: 0.95rem;
	cursor: pointer;
	margin-top: var(--space-3);
}
body.th-bp-internal #buddypress #avatar-upload-form #upload:hover,
body.th-bp-internal #buddypress #avatar-upload-form #avatar-crop-submit:hover,
body.th-bp-internal #buddypress .avatar-crop-submit:hover,
body.th-bp-internal #buddypress .bp-avatar input[type="submit"]:hover,
body.th-bp-internal #buddypress .bp-cover-image input[type="submit"]:hover,
body.th-bp-internal #buddypress .standard-form button[type="submit"]:hover,
body.th-bp-internal #buddypress .standard-form input[type="submit"]:hover {
	background: var(--color-brand-hover);
	border-color: var(--color-brand-hover);
}
body.th-bp-internal #buddypress .bp-avatar-delete a,
body.th-bp-internal #buddypress .bp-cover-image-manage a,
body.th-bp-internal #buddypress #avatar-upload-form a.button.edit {
	background: transparent;
	color: var(--color-text-muted);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-full);
	padding: var(--space-2) var(--space-4);
	text-decoration: none;
}
body.th-bp-internal #buddypress .bp-avatar-delete a:hover,
body.th-bp-internal #buddypress .bp-cover-image-manage a:hover,
body.th-bp-internal #buddypress #avatar-upload-form a.button.edit:hover {
	color: var(--color-text);
	border-color: var(--color-text-muted);
}

/* ----- 5. Progreso / estado ----- */
body.th-bp-internal #buddypress .bp-avatar-status,
body.th-bp-internal #buddypress .bp-cover-image-status,
body.th-bp-internal #buddypress .bp-uploader-progress {
	background: var(--color-surface-2);
	color: var(--color-text);
	border-radius: var(--radius-md);
	padding: var(--space-3);
	margin-top: var(--space-3);
}
body.th-bp-internal #buddypress .bp-progress {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-full);
	overflow: hidden;
}
body.th-bp-internal #buddypress .bp-progress .bp-bar {
	background: var(--color-brand);
}

/* ----- 6. Feedback (mensajes éxito/error) ----- */
body.th-bp-internal #buddypress .bp-avatar-feedback,
body.th-bp-internal #buddypress #bp-cover-image-feedback {
	background: var(--color-surface-2);
	color: var(--color-text);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-3);
}
body.th-bp-internal #buddypress .bp-avatar-feedback.success,
body.th-bp-internal #buddypress #bp-cover-image-feedback.success,
body.th-bp-internal #buddypress .bp-avatar-feedback.updated,
body.th-bp-internal #buddypress #bp-cover-image-feedback.updated {
	color: var(--color-brand);
	border-color: var(--color-brand);
}
body.th-bp-internal #buddypress .bp-avatar-feedback.error,
body.th-bp-internal #buddypress #bp-cover-image-feedback.error {
	color: var(--color-text);
	border-color: var(--color-border);
}

/* ----- 7. Inputs del form legacy ----- */
body.th-bp-internal #buddypress #avatar-upload-form input[type="file"] {
	color: var(--color-text);
	background: var(--color-surface-2);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2);
}

/* ==========================================================================
   VISTAS DE ACTIVIDAD DEL SHELL (perfil, grupo, y futuras) — bloque COMÚN.
   buddypress.css carga en todas las vistas is_buddypress del shell, así que
   este bloque (scope body.th-bp-internal) cubre el filtro "Show", los botones
   de acción y el compositor en TODAS de una vez — sin parchear vista por vista.
   /community/ NO es body.th-bp-internal (template autónomo) → lo gestiona
   feed.css aparte; este bloque no lo toca. El shell es siempre html.dark, así
   que usamos las variantes oscuras de iconos directamente.
   Portado de: groups-single.css (filtro + compositor) y feed.css:514-624 (acciones).
   ========================================================================== */

/* ----- 1. Filtro "Show:" (#activity-filter-by) ----- */
body.th-bp-internal #buddypress #activity-filter-select {
	float: none;
	margin: 0;
	display: flex;
	align-items: center;
	gap: var(--space-2);
}
body.th-bp-internal #buddypress #activity-filter-select label {
	font-size: 0.8rem;
	color: var(--color-text-muted);
}
body.th-bp-internal #buddypress #activity-filter-by {
	max-width: none;
	font-size: 0.85rem;
	padding: var(--space-2) var(--space-3);
	color: var(--color-text);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
}

/* ----- 2. Botones de acción de cada actividad (.activity-meta) ----- */
body.th-bp-internal #buddypress .activity-meta {
	display: flex;
	align-items: center;
	gap: 0;
	margin-top: var(--space-3);
	padding-top: var(--space-2);
	border-top: 1px solid var(--color-border);
}
body.th-bp-internal #buddypress .activity-meta .button {
	flex: 1;
	background: none;
	border: none;
	padding: 8px var(--space-2);
	border-radius: var(--radius-md);
	color: var(--color-text-muted);
	font-family: var(--font-sans);
	font-weight: 600;
	font-size: 0.8125rem;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	text-decoration: none;
	line-height: 1.2;
	transition: background var(--duration-fast) var(--ease),
	            color var(--duration-fast) var(--ease);
}
body.th-bp-internal #buddypress .activity-meta .button::before {
	content: '';
	display: inline-block;
	width: 18px;
	height: 18px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	flex: 0 0 auto;
}
/* Comment (bubble) — variante oscura */
body.th-bp-internal #buddypress .activity-meta .button.acomment-reply::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238B95A1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/></svg>");
}
/* Favorite (heart outline) — variante oscura */
body.th-bp-internal #buddypress .activity-meta .button.fav::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238B95A1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'/></svg>");
}
/* Unfavorite (heart filled) */
body.th-bp-internal #buddypress .activity-meta .button.unfav::before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%23FF3B5C'><path d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/></svg>");
}
body.th-bp-internal #buddypress .activity-meta .button:hover {
	background: var(--color-surface-2);
	color: var(--color-text);
	text-decoration: none;
}
body.th-bp-internal #buddypress .activity-meta .button.unfav {
	color: var(--color-like);
}
body.th-bp-internal #buddypress .activity-meta .button.unfav:hover {
	background: rgba(255, 59, 92, 0.12);
	color: var(--color-like);
}
/* Delete — discreto al final */
body.th-bp-internal #buddypress .activity-meta .delete-activity {
	flex: 0 0 auto;
	padding: 4px 8px;
	font-size: 0.75rem;
	color: var(--color-text-muted);
	opacity: 0.6;
	text-decoration: none;
	border-radius: var(--radius-md);
	transition: opacity var(--duration-fast) var(--ease),
	            color var(--duration-fast) var(--ease);
}
body.th-bp-internal #buddypress .activity-meta .delete-activity:hover {
	opacity: 1;
	color: var(--color-like);
}
body.th-bp-internal #buddypress .activity-meta .th-post__action-count {
	font-variant-numeric: tabular-nums;
}

/* ----- 3. Compositor (.th-composer__form / #whats-new) ----- */
body.th-bp-internal .th-composer__form {
	margin: 0 0 var(--space-5);
	padding: var(--space-4);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
}
body.th-bp-internal .th-composer__row { display: flex; align-items: flex-start; gap: var(--space-3); }
body.th-bp-internal .th-composer__avatar {
	flex: 0 0 auto; width: 44px; height: 44px;
	border-radius: var(--radius-full); overflow: hidden; background: var(--color-brand-soft);
}
body.th-bp-internal .th-composer__avatar a { display: block; width: 100%; height: 100%; }
body.th-bp-internal .th-composer__avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-full); display: block; }
body.th-bp-internal .th-composer__content { flex: 1; min-width: 0; }
body.th-bp-internal .th-composer__form .activity-greeting { margin: 0; }
body.th-bp-internal .th-composer__form .bp-screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
/* Textarea #whats-new — fix del fondo blanco (especificidad 2,1,1 vs bp-legacy 2,0,2) */
body.th-bp-internal #buddypress #whats-new {
	display: block; width: 100%; min-height: 44px; height: auto;
	background: var(--color-surface-2); border: 1px solid transparent; border-radius: var(--radius-lg);
	padding: 11px var(--space-4); color: var(--color-text);
	font-family: var(--font-sans); font-size: 0.9375rem; line-height: 1.4; resize: vertical;
	transition: border-color var(--duration-fast) var(--ease), background var(--duration-fast) var(--ease);
}
body.th-bp-internal #buddypress #whats-new::placeholder { color: var(--color-text-muted); }
body.th-bp-internal #buddypress #whats-new:focus,
body.th-bp-internal #buddypress #whats-new:focus-visible {
	outline: none; border-color: var(--color-brand); background: var(--color-bg);
}
body.th-bp-internal .th-composer__actions {
	display: flex; align-items: center; gap: var(--space-2);
	margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--color-border);
}
body.th-bp-internal .th-composer__tools-slot { order: 1; flex: 1; display: flex; align-items: center; gap: var(--space-1); min-height: 36px; }
body.th-bp-internal .th-composer__post-in { order: 2; font-size: 0.8125rem; color: var(--color-text-muted); display: flex; align-items: center; gap: var(--space-2); }
body.th-bp-internal .th-composer__post-in select { background: var(--color-surface-2); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 4px 8px; font-family: var(--font-sans); font-size: 0.8125rem; color: var(--color-text); }
body.th-bp-internal .th-composer__submit-wrap { order: 3; }
body.th-bp-internal .th-composer__submit {
	background: var(--color-brand); color: #fff; border: none; border-radius: var(--radius-full);
	padding: 8px 20px; font-family: var(--font-sans); font-weight: 700; font-size: 0.875rem; cursor: pointer;
	transition: background var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease);
}
body.th-bp-internal .th-composer__submit:hover { background: var(--color-brand-hover); }
body.th-bp-internal .th-composer__submit:active { transform: scale(0.97); }
body.th-bp-internal .th-composer__submit:disabled { opacity: 0.5; cursor: not-allowed; }

/* Respuesta inline a comentarios (.ac-form) — NUEVO (no estaba en groups-single) */
body.th-bp-internal #buddypress .ac-form { margin-top: var(--space-3); }
body.th-bp-internal #buddypress .ac-input {
	width: 100%; background: var(--color-surface-2); color: var(--color-text);
	border: 1px solid var(--color-border); border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-3); font-family: var(--font-sans); font-size: 0.9rem; resize: vertical;
}
body.th-bp-internal #buddypress .ac-input:focus { outline: none; border-color: var(--color-brand); }
body.th-bp-internal #buddypress .ac-form input[type="submit"] {
	background: var(--color-brand); color: #fff; border: none; border-radius: var(--radius-full);
	padding: var(--space-2) var(--space-4); font-weight: 600; font-size: 0.8rem; cursor: pointer; margin-top: var(--space-2);
}
body.th-bp-internal #buddypress .ac-form input[type="submit"]:hover { background: var(--color-brand-hover); }
body.th-bp-internal #buddypress .ac-reply-cancel { color: var(--color-text-muted); font-size: 0.8rem; text-decoration: none; }
body.th-bp-internal #buddypress .ac-reply-cancel:hover { color: var(--color-text); }

/* ==========================================================================
   NOTIFICATIONS (/members/USER/notifications/) — bp-legacy puro, sin override.
   buddypress.css carga en el shell; table.notifications / #notifications-sort-order-list
   solo existen aquí → inerte en el resto. El sub-nav Unread/Read ya lo cubre el
   estilo de tabs (T6). Scope body.th-bp-internal #buddypress, solo tokens.
   ========================================================================== */

/* ----- Select de orden "Order By" (#notifications-sort-order-list) + "Go" -----
   NO es #activity-filter-by → el bloque común no lo cubría. Mismo look que el "Show". */
body.th-bp-internal #buddypress #members-order-select {
	float: none; margin: 0; display: flex; align-items: center; gap: var(--space-2);
}
body.th-bp-internal #buddypress #notifications-sort-order label {
	font-size: 0.8rem; color: var(--color-text-muted);
}
body.th-bp-internal #buddypress #notifications-sort-order-list {
	max-width: none; font-size: 0.85rem; padding: var(--space-2) var(--space-3);
	color: var(--color-text); background: var(--color-surface);
	border: 1px solid var(--color-border); border-radius: var(--radius-md);
}
body.th-bp-internal #buddypress #notifications-sort-order .submit {
	background: var(--color-surface-2); color: var(--color-text);
	border: 1px solid var(--color-border); border-radius: var(--radius-full);
	padding: var(--space-2) var(--space-3); font-size: 0.8rem; cursor: pointer;
}

/* ----- Feedback boxes #message (info/warning/error/updated) — GENÉRICO del shell.
   bp-legacy pinta el recuadro en el <p> INTERNO (#buddypress div#message p), no en
   el contenedor. Estilamos el <p> (la caja real) → cubre TODAS las variantes de una
   vez. Especificidad (2,1,3) vence a bp-legacy (2,0,2) sin !important. ----- */
body.th-bp-internal #buddypress div#message p {
	background-color: var(--color-surface-2);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	color: var(--color-text);
	padding: var(--space-3) var(--space-4);
	font-weight: 400;
}
body.th-bp-internal #buddypress div#message.error p   { border-color: var(--color-like); }
body.th-bp-internal #buddypress div#message.updated p { border-color: var(--color-brand); }

/* ----- Tabla ----- */
body.th-bp-internal #buddypress table.notifications {
	width: 100%; border-collapse: collapse; background: transparent; margin: var(--space-3) 0;
}
/* columna "icon" vacía → fuera */
body.th-bp-internal #buddypress table.notifications th.icon,
body.th-bp-internal #buddypress table.notifications tbody td:first-child { display: none; }
/* cabeceras */
body.th-bp-internal #buddypress table.notifications thead th {
	text-align: left; font-size: 0.75rem; font-weight: 600; text-transform: uppercase;
	letter-spacing: 0.02em; color: var(--color-text-muted);
	padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--color-border);
	background: transparent;
}
/* filas */
body.th-bp-internal #buddypress table.notifications tbody tr {
	border-bottom: 1px solid var(--color-border);
	transition: background var(--duration-fast) var(--ease);
}
body.th-bp-internal #buddypress table.notifications tbody tr:hover { background: var(--color-surface-2); }
body.th-bp-internal #buddypress table.notifications tbody td {
	padding: var(--space-3); color: var(--color-text); vertical-align: middle; border: 0;
}
body.th-bp-internal #buddypress table.notifications .notification-since {
	color: var(--color-text-muted); font-size: 0.85rem; white-space: nowrap;
}

/* ----- Checkboxes ----- */
body.th-bp-internal #buddypress #select-all-notifications,
body.th-bp-internal #buddypress .notification-check {
	accent-color: var(--color-brand); width: 16px; height: 16px; cursor: pointer;
}

/* ----- Acciones (marcar leída/no-leída, borrar) ----- */
body.th-bp-internal #buddypress .notification-actions a {
	display: inline-block; color: var(--color-brand); text-decoration: none;
	font-size: 0.8rem; font-weight: 600; margin-right: var(--space-2);
}
body.th-bp-internal #buddypress .notification-actions a:hover { text-decoration: underline; }
body.th-bp-internal #buddypress .notification-actions a.delete { color: var(--color-text-muted); }
body.th-bp-internal #buddypress .notification-actions a.delete:hover { color: var(--color-like); }

/* ----- Bulk dropdown + Apply ----- */
body.th-bp-internal #buddypress .notifications-options-nav {
	display: flex; align-items: center; gap: var(--space-2); margin-top: var(--space-3);
}
body.th-bp-internal #buddypress #notification-select {
	font-size: 0.85rem; padding: var(--space-2) var(--space-3);
	color: var(--color-text); background: var(--color-surface);
	border: 1px solid var(--color-border); border-radius: var(--radius-md);
}
body.th-bp-internal #buddypress #notification-bulk-manage {
	background: var(--color-brand); color: #fff; border: 1px solid var(--color-brand);
	border-radius: var(--radius-full); padding: var(--space-2) var(--space-4);
	font-weight: 600; font-size: 0.85rem; cursor: pointer;
}
body.th-bp-internal #buddypress #notification-bulk-manage:hover {
	background: var(--color-brand-hover); border-color: var(--color-brand-hover);
}

/* ----- Paginación (GENÉRICA del shell: notifications + directorios) ----- */
body.th-bp-internal #buddypress .pagination .pag-count { color: var(--color-text-muted); font-size: 0.85rem; }
body.th-bp-internal #buddypress .pagination-links a,
body.th-bp-internal #buddypress .pagination-links span {
	color: var(--color-text-muted); padding: 2px 8px; border-radius: var(--radius-md); text-decoration: none;
}
body.th-bp-internal #buddypress .pagination-links a:hover { color: var(--color-text); background: var(--color-surface-2); }
body.th-bp-internal #buddypress .pagination-links span.current { color: var(--color-brand); font-weight: 700; }

/* ==========================================================================
   SELECTS DEL SHELL — regla general (DRY).
   Todos los <select> de BP en el shell (Order By / Show / Sort / Bulk / forms)
   en una sola regla → no hay que añadir ids por vista. Cubre #members-friends
   (Friends) y cualquier select futuro. Las reglas por-id previas son más
   específicas y siguen ganando con los mismos valores (sin conflicto). El
   post-in del compositor es más específico → mantiene su look propio.
   ========================================================================== */
body.th-bp-internal #buddypress select {
	max-width: none;
	font-size: 0.85rem;
	padding: var(--space-2) var(--space-3);
	color: var(--color-text);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
}

/* Opciones del desplegable ABIERTO. Sin esto el <option> sale con el fondo
   blanco por defecto del navegador y, al heredar el texto claro del select,
   queda ilegible. Estilable en Chrome/Firefox (Windows/Linux); Safari macOS
   pinta el popup nativo y lo ignora (limitación del SO, no de este CSS). */
body.th-bp-internal #buddypress select option {
	background: var(--color-surface-2);
	color: var(--color-text);
}

/* ==========================================================================
   Inputs de texto de formularios .standard-form — GENÉRICO del shell (DRY).
   Settings (#settings-form), edición de perfil (#profile-edit-form), creación
   de grupos… todos usan .standard-form, así que una sola regla los cubre y
   sirve para formularios BP futuros. Scope a .standard-form a propósito: el
   composer (#whats-new) y la respuesta inline (.ac-input) NO son standard-form
   y conservan su estilo propio. Los <select> ya tienen su regla general aparte.
   ========================================================================== */
body.th-bp-internal #buddypress .standard-form input[type="text"],
body.th-bp-internal #buddypress .standard-form input[type="email"],
body.th-bp-internal #buddypress .standard-form input[type="password"],
body.th-bp-internal #buddypress .standard-form input[type="search"],
body.th-bp-internal #buddypress .standard-form textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background: var(--color-surface-2);
	color: var(--color-text);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-2) var(--space-3);
	font-family: var(--font-sans);
	font-size: 0.9rem;
}
body.th-bp-internal #buddypress .standard-form textarea { resize: vertical; }
body.th-bp-internal #buddypress .standard-form input[type="text"]:focus,
body.th-bp-internal #buddypress .standard-form input[type="email"]:focus,
body.th-bp-internal #buddypress .standard-form input[type="password"]:focus,
body.th-bp-internal #buddypress .standard-form input[type="search"]:focus,
body.th-bp-internal #buddypress .standard-form textarea:focus {
	outline: none;
	border-color: var(--color-brand);
}
body.th-bp-internal #buddypress .standard-form input::placeholder,
body.th-bp-internal #buddypress .standard-form textarea::placeholder {
	color: var(--color-text-muted);
}
/* Labels de formularios .standard-form (registro BP, edición de perfil…). Sin
   esto caen al gris por defecto de Astra, ilegibles sobre fondo oscuro. */
body.th-bp-internal #buddypress .standard-form label,
body.th-bp-internal #buddypress .standard-form .label {
	color: var(--color-text);
}
/* Nombres de campo xprofile (Name, Animal Kin, Country…). OJO: en BuddyPress
   NO son <label> sino <legend> dentro de <fieldset> — por eso las reglas de
   'label' nunca los tocaron (error histórico). Hay que apuntar a 'legend'.
   !important: el Customizer fuerza '#buddypress legend { color: var(--accent-pale)
   !important }'; esta regla (1 id + 3 clases + legend) tiene mayor especificidad
   y, con !important, gana. Si algún día se retira ese CSS del Customizer, el
   !important de aquí deja de ser necesario pero no estorba. */
body.th-bp-internal #buddypress .standard-form legend {
	color: var(--color-text) !important;
}