/* --- GROUP DIRECTORY BUTTONS (override Nouveau) ------------------- */

/* Basis reset: dit wint van .buddypress .buddypress-wrap button {...} */
.buddypress .buddypress-wrap button.group-button {
  appearance: none !important;
  background: var(--ch-accent) !important;
  color: #0b0d10 !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  min-height: 38px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
  cursor: pointer !important;
}

/* States */
.buddypress .buddypress-wrap button.group-button:hover {
  filter: brightness(1.06) !important;
  transform: translateY(-1px) !important;
}
.buddypress .buddypress-wrap button.group-button:focus {
  outline: 2px solid color-mix(in srgb, var(--ch-accent) 60%, #fff 40%) !important;
  outline-offset: 2px !important;
}

/* Pending/disabled zachter (als BP 'pending' plakt) */
.buddypress .buddypress-wrap button.group-button.pending {
  background: var(--ch-surface-2) !important;
  color: var(--ch-text-muted) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: default !important;
}

/* Plaatsing in de card-actiezone */
#buddypress ul#groups-list > li .action {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: auto !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}

/* === GROUP CARD LAYOUT ======================================= */
#buddypress ul#groups-list > li .item {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* Titel bovenaan, groot */
#buddypress ul#groups-list > li .item-title,
#buddypress ul#groups-list > li .item-title a {
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  color: var(--ch-text) !important;
  text-decoration: none !important;
}

/* Beschrijving net eronder, iets subtieler */
#buddypress ul#groups-list > li .item-desc {
  color: var(--ch-text-muted) !important;
  font-size: 0.92rem !important;
  line-height: 1.4 !important;
}

/* Laatste activiteit helemaal onderin (boven de .action) */
#buddypress ul#groups-list > li .item-meta,
#buddypress ul#groups-list > li .last-activity {
  margin-top: auto !important;
  font-size: 0.85rem !important;
  color: var(--ch-text-muted) !important;
  font-style: italic !important;
  opacity: .9;
}

/* === MEMBER CARDS LAYOUT ===================================== */
#buddypress ul#members-list > li .item {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* Naam van het lid */
#buddypress ul#members-list > li .item-title,
#buddypress ul#members-list > li .item-title a {
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  color: var(--ch-text) !important;
  text-decoration: none !important;
  margin-bottom: 2px !important;
}

/* Actiezone direct onder de naam */
#buddypress ul#members-list > li .action {
  order: 2; /* forceer boven de meta */
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 4px 0 !important;
}

/* Laatste activiteit onder de knoppen */
#buddypress ul#members-list > li .item-meta,
#buddypress ul#members-list > li .last-activity {
  order: 3;
  font-size: 0.85rem !important;
  color: var(--ch-text-muted) !important;
  font-style: italic !important;
  opacity: .9;
  margin-top: auto !important;
}

/* === MEMBER CARD BUTTONS — OVERRULE NOUVEAU ========================== */

/* Actierij (al gedaan, maar nog even strak) */
#buddypress ul#members-list > li .action{
  display:flex !important; flex-wrap:wrap !important; gap:10px !important;
  margin:6px 0 !important;
}

/* 1) Buttons in leden-cards: anchors, .button, echte <button>, en form inputs */
#buddypress .buddypress-wrap ul#members-list li .action .generic-button a,
#buddypress .buddypress-wrap ul#members-list li .action a.button,
#buddypress .buddypress-wrap ul#members-list li .action button,
#buddypress .buddypress-wrap ul#members-list li .action input[type="submit"],
#buddypress .buddypress-wrap ul#members-list li .action input[type="button"]{
  appearance:none !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  min-height:38px !important; padding:0 14px !important; gap:8px !important;
  border-radius:10px !important; border:1px solid transparent !important;
  background:var(--ch-accent) !important; color:#0b0d10 !important;
  font-weight:600 !important; line-height:1 !important; text-decoration:none !important;
  cursor:pointer !important; box-shadow:0 1px 2px rgba(0,0,0,.18) !important;
  transition:transform .15s ease, filter .15s ease, background-color .15s ease !important;
}

/* 2) Specifiek voor BuddyPress klasses die vaak voorkomen */
#buddypress .buddypress-wrap ul#members-list li .action button.friendship-button,
#buddypress .buddypress-wrap ul#members-list li .action button.send-message,
#buddypress .buddypress-wrap ul#members-list li .action button.follow-button{
  /* Zelfde stijl als hierboven; de selector zorgt dat ze zeker 'winnen' */
}

/* 3) Hover & focus */
#buddypress .buddypress-wrap ul#members-list li .action a:hover,
#buddypress .buddypress-wrap ul#members-list li .action button:hover,
#buddypress .buddypress-wrap ul#members-list li .action input[type="submit"]:hover{
  filter:brightness(1.06) !important; transform:translateY(-1px) !important;
}
#buddypress .buddypress-wrap ul#members-list li .action a:focus,
#buddypress .buddypress-wrap ul#members-list li .action button:focus{
  outline:2px solid color-mix(in srgb, var(--ch-accent) 60%, #fff 40%) !important;
  outline-offset:2px !important;
}

/* 4) Secundair/outline/pending varianten */
#buddypress .buddypress-wrap ul#members-list li .action .generic-button a.secondary,
#buddypress .buddypress-wrap ul#members-list li .action a.outline,
#buddypress .buddypress-wrap ul#members-list li .action .pending{
  background:transparent !important; color:var(--ch-text) !important;
  border-color:rgba(255,255,255,.20) !important;
}
#buddypress .buddypress-wrap ul#members-list li .action .generic-button a.secondary:hover,
#buddypress .buddypress-wrap ul#members-list li .action a.outline:hover{
  background:var(--ch-surface-2) !important; border-color:transparent !important;
}

/* 5) Disabled/pending echt gedimd */
#buddypress .buddypress-wrap ul#members-list li .action a[aria-disabled="true"],
#buddypress .buddypress-wrap ul#members-list li .action .disabled,
#buddypress .buddypress-wrap ul#members-list li .action input[disabled]{
  opacity:.55 !important; cursor:not-allowed !important; transform:none !important; filter:none !important;
}

/* 6) Zorg dat forms binnen .generic-button nooit full-width forceren */
#buddypress .buddypress-wrap ul#members-list li .action .generic-button form{ display:inline !important; }
#buddypress .buddypress-wrap ul#members-list li .action .generic-button form input[type="submit"]{ width:auto !important; }
#buddypress .buddypress-wrap ul#members-list li .action button.friendship-button{
  border:2px dashed magenta !important;
}

/* === MEMBERS DIRECTORY — OVERRULE NOUVEAU BUTTONS ===================== */
/* Richt alleen de knoppen in de ledenlijst aan; laat andere BP-knoppen met rust. */

#buddypress .buddypress-wrap ul#members-list li .action .generic-button a,
#buddypress .buddypress-wrap ul#members-list li .action a.button,
#buddypress .buddypress-wrap ul#members-list li .action button,
#buddypress .buddypress-wrap ul#members-list li .action input[type="button"],
#buddypress .buddypress-wrap ul#members-list li .action input[type="reset"],
#buddypress .buddypress-wrap ul#members-list li .action input[type="submit"] {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  gap: 8px !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: var(--ch-accent) !important;
  color: #0b0d10 !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
  transition: transform .15s ease, filter .15s ease, background-color .15s ease !important;
}

/* Specifiek de friendship-button meepakken (veiligheidsnet) */
#buddypress .buddypress-wrap ul#members-list li .action button.friendship-button {
  background: var(--ch-accent) !important;
  color: #0b0d10 !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  font-weight: 600 !important;
}

/* Hover/focus */
#buddypress .buddypress-wrap ul#members-list li .action a:hover,
#buddypress .buddypress-wrap ul#members-list li .action button:hover,
#buddypress .buddypress-wrap ul#members-list li .action input[type="submit"]:hover {
  filter: brightness(1.06) !important;
  transform: translateY(-1px) !important;
}
#buddypress .buddypress-wrap ul#members-list li .action a:focus,
#buddypress .buddypress-wrap ul#members-list li .action button:focus {
  outline: 2px solid color-mix(in srgb, var(--ch-accent) 60%, #fff 40%) !important;
  outline-offset: 2px !important;
}

/* Pending/secondary varianten vriendelijker */
#buddypress .buddypress-wrap ul#members-list li .action .generic-button a.secondary,
#buddypress .buddypress-wrap ul#members-list li .action .pending,
#buddypress .buddypress-wrap ul#members-list li .action a.outline {
  background: transparent !important;
  color: var(--ch-text) !important;
  border-color: rgba(255,255,255,.20) !important;
}
#buddypress .buddypress-wrap ul#members-list li .action .generic-button a.secondary:hover,
#buddypress .buddypress-wrap ul#members-list li .action a.outline:hover {
  background: var(--ch-surface-2) !important;
  border-color: transparent !important;
}
#buddypress .buddypress-wrap ul#members-list li .action button.friendship-button {
  border: 2px dashed magenta !important;
}

/* ——— Vriendschapknoppen overal hetzelfde uiterlijk ——— */
button.friendship-button,
.buddypress-wrap button.friendship-button,
#buddypress button.friendship-button,
.generic-button button.friendship-button {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  gap: 8px !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: var(--ch-accent) !important;
  color: #0b0d10 !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
  transition: transform .15s ease, filter .15s ease, background-color .15s ease !important;
}

button.friendship-button:hover { filter: brightness(1.06) !important; transform: translateY(-1px) !important; }
button.friendship-button[disabled],
button.friendship-button[aria-disabled="true"] { opacity: .55 !important; cursor: not-allowed !important; transform: none !important; }

/* Secundaire/pending staat neutraler */
button.friendship-button.pending { 
  background: var(--ch-surface-2) !important; 
  color: var(--ch-text) !important; 
  border-color: rgba(255,255,255,.20) !important;
  box-shadow: none !important;
}
button.friendship-button { border: 2px dashed magenta !important; }

/* Styling op onze eigen hook-klasse (wint altijd als hij aanwezig is) */
button.friendship-button.ch-btn {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: var(--ch-accent) !important;
  color: #0b0d10 !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
}
button.friendship-button.ch-btn:hover { filter: brightness(1.06) !important; transform: translateY(-1px) !important; }

/* Leesbaarheid Activity (BuddyPress Nouveau) */
#buddypress {
  --ch-text: var(--vp-text, #111);
  --ch-muted: var(--vp-muted, #445066);
  --ch-link: var(--vp-link, #0a58ca);
}

/* Basis tekst in items */
#buddypress #activity-stream li .activity-content,
#buddypress #activity-stream li .activity-content p,
#buddypress #activity-stream li .activity-inner {
  color: var(--ch-text);
  line-height: 1.6;
  font-size: 1rem;
  opacity: 1; /* sommige thema’s verlagen dit */
}

/* Header (actie-regel: “Rudy plaatste…” ) */
#buddypress #activity-stream li .activity-header,
#buddypress #activity-stream li .activity-header a {
  color: var(--ch-text);
  font-weight: 600;
}

/* Links in content */
#buddypress #activity-stream li .activity-content a {
  color: var(--ch-link);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Meta/knoppen onder het bericht (tijd, reageren, like) */
#buddypress #activity-stream li .activity-meta,
#buddypress #activity-stream li .activity-meta a,
#buddypress #activity-stream li .activity-comments .ac-reply-cancel {
  color: var(--ch-muted);
  font-size: .92rem;
}

/* Reacties (comment content) */
#buddypress #activity-stream li .acomment-content {
  color: var(--ch-text);
  line-height: 1.55;
}

/* Citaten & code in content – optioneel maar fijn */
#buddypress #activity-stream li blockquote {
  margin: .75rem 0;
  padding: .5rem .75rem;
  border-left: 3px solid var(--ch-muted);
  background: rgba(0,0,0,.03);
}
#buddypress #activity-stream li pre, 
#buddypress #activity-stream li code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background: rgba(0,0,0,.05);
  padding: .2rem .35rem;
  border-radius: 4px;
  color: var(--ch-text);
}

/* Zorg dat niks de tekst vaag maakt */
#buddypress #activity-stream li .activity-content * {
  filter: none;
}

/* Dark mode (indien je een data-theme gebruikt) */
[data-theme="dark"] #buddypress {
  --ch-text: #e7eaf0;
  --ch-muted: #aeb8c6;
  --ch-link: #8ab4ff;
}
[data-theme="dark"] #buddypress #activity-stream li blockquote {
  background: rgba(255,255,255,.04);
}
[data-theme="dark"] #buddypress #activity-stream li pre,
[data-theme="dark"] #buddypress #activity-stream li code {
  background: rgba(255,255,255,.08);
}

/*Verbergen van de favorieten voor de reacties knop*/
#buddypress .activity-meta .button.fav,
#buddypress .activity-meta .button.unfav { display: none !important; }

/* Notificatie tabel beter leesbaar */
#buddypress table.notifications td,
#buddypress table.notifications th {
  color: var(--ch-text, #111);
}
#buddypress table.notifications td.notification-since {
  color: var(--ch-muted, #445066);
  opacity: 1;
}

/* Headers notificatie-tabel duidelijk en contrastrijk */
#buddypress table.notifications th,
#buddypress table.notifications th a {
  color: var(--ch-text, #111) !important;
  font-weight: 700;
  opacity: 1;
}
#buddypress table.notifications th { background: transparent; }
#buddypress table.notifications th, 
#buddypress table.notifications td { vertical-align: middle; }

/* Notificatie-lijst: headers en inhoud */
#buddypress table.notifications th,
#buddypress table.notifications th a {
  color: var(--ch-text, #111) !important;
  font-weight: 700;
  opacity: 1;
}
#buddypress table.notifications td,
#buddypress table.notifications td a {
  color: var(--ch-text, #111);
}
#buddypress table.notifications td.notification-since {
  color: var(--ch-muted, #445066);
  opacity: 1;
}

/* ==== BP Notifications: duidelijke, consistente table headers ==== */

/* 1) Centrale tokens voor headerkleuren (pas deze 2 desnoods aan) */
#buddypress table.notifications {
  --head-bg: #0f172a;               /* of bij donkere balk: #0f172a */
  --head-fg: #fff;      /* of #fff als de balk donker is */
}

/* 2) Thead altijd zichtbaar en met onze kleuren */
#buddypress table.notifications thead {
  display: table-header-group !important;
  background: var(--head-bg);
  color: var(--head-fg);
}

/* 3) Kopcellen en hun links erven kleur + typografie */
#buddypress table.notifications thead th,
#buddypress table.notifications thead th a {
  color: inherit !important;
  font-weight: 700;
  font-size: .95rem;
  opacity: 1 !important;
  text-indent: 0 !important;
  white-space: nowrap;
  padding: .6rem .75rem;
}

/* 4) Specifieke uitlijning per kolom */
#buddypress table.notifications thead th.title { text-align: left; }
#buddypress table.notifications thead th.date  { text-align: right; }

/* 5) Eventuele ‘screen reader only’ tekst ont-verbergen (als thema die gebruikt) */
#buddypress table.notifications thead .screen-reader-text,
#buddypress table.notifications thead .bp-screen-reader-text {
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  clip: auto !important;
  clip-path: none !important;
  overflow: visible !important;
  text-indent: 0 !important;
  white-space: nowrap !important;
}

/* Weergave van afbeeldingen ín de activiteit */
#buddypress .vp-activity-media-grid {
  display: grid;
  grid-template-columns: repeat( auto-fill, minmax(140px, 1fr) );
  gap: 8px;
  margin-top: 8px;
}
#buddypress .vp-activity-media-grid .vp-media-item img {
  border-radius: 8px;
  display: block;
  width: 100%; height: auto;
}