/* ================================================
   BUDDY-DESIGN.CSS – Estudio Arquitectos
   Rediseño completo BuddyPress / Kleo Child
   Paleta crema #F5F3EF · Cormorant Garamond + DM Sans
   ================================================ */

/* ── Variables globales ── */
:root {
  --cream:        #F5F3EF;
  --cream-dark:   #EAE7E1;
  --cream-border: #D8D4CC;
  --ink:          #1A1816;
  --ink-soft:     #4A4540;
  --ink-muted:    #8A857D;
  --accent:       #1A1816;
  --white:        #FFFFFF;
  --serif:        'Cormorant Garamond', Georgia, serif;
  --sans:         'DM Sans', system-ui, sans-serif;
  --radius:       2px;
  --transition:   0.22s ease;
  --shadow-soft:  0 1px 6px rgba(26,24,22,0.06);
  --shadow-card:  0 2px 16px rgba(26,24,22,0.08);
}

/* ── Reset global en contexto BP ── */
body.buddypress,
body.bp-user,
body.registration,
body.activation,
body.members,
body.groups,
body.activity {
  background-color: var(--cream) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* ================================================
   OCULTAR HEADER KLEO COMPLETO EN BUDDYPRESS
   ================================================ */
body.buddypress #header,
body.buddypress #top-bar,
body.buddypress .kleo-top-bar,
body.buddypress .kleo-navbar,
body.buddypress #kleo-header,
body.buddypress .navbar-wrapper,
body.buddypress .top-bar,
body.buddypress .breadcrumb-area,
body.buddypress .kleo-breadcrumb,
body.bp-user #header,
body.bp-user #top-bar,
body.bp-user .kleo-top-bar,
body.bp-user .kleo-navbar,
body.bp-user #kleo-header,
body.bp-user .navbar-wrapper,
body.bp-user .top-bar,
body.bp-user .breadcrumb-area,
body.bp-user .kleo-breadcrumb,
body.registration #header,
body.registration #top-bar,
body.registration .kleo-top-bar,
body.registration .kleo-navbar,
body.registration #kleo-header,
body.registration .navbar-wrapper,
body.registration .top-bar,
body.activation #header,
body.activation #top-bar,
body.activation .kleo-top-bar,
body.activation .kleo-navbar,
body.activation #kleo-header,
body.members #header,
body.members .kleo-top-bar,
body.members .navbar-wrapper,
body.groups #header,
body.groups .kleo-top-bar,
body.groups .navbar-wrapper {
  display: none !important;
}

/* Quitar padding-top que Kleo agrega para el header fijo */
body.buddypress .kleo-main-container,
body.bp-user .kleo-main-container,
body.registration .kleo-main-container,
body.activation .kleo-main-container,
body.members .kleo-main-container,
body.groups .kleo-main-container {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ================================================
   MINI HEADER PROPIO (logo + nav simple)
   ================================================ */
.ea-site-header {
  background: var(--cream);
  border-bottom: 1px solid var(--cream-border);
  padding: 18px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 999;
}

.ea-site-header .ea-logo {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--ink);
  text-decoration: none;
}

.ea-site-header .ea-logo span {
  font-style: italic;
  font-weight: 300;
}

.ea-header-nav {
  display: flex;
  gap: 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ea-header-nav a {
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
  text-decoration: none;
  transition: color var(--transition);
}

.ea-header-nav a:hover {
  color: var(--ink);
}

/* ================================================
   CONTENEDOR PRINCIPAL
   ================================================ */
.buddypress-wrap,
#buddypress,
.bp-wrap {
  max-width: 860px;
  margin: 0 auto;
  padding: 48px 24px 80px;
}

/* ================================================
   TIPOGRAFÍA
   ================================================ */
.buddypress h1,
.buddypress h2,
.buddypress h3,
.bp-user h1,
.bp-user h2,
.bp-user h3 {
  font-family: var(--serif) !important;
  font-weight: 400;
  line-height: 1.2;
  color: var(--ink);
}

.buddypress h1 { font-size: 2.8rem; }
.buddypress h2 { font-size: 2rem; }
.buddypress h3 { font-size: 1.4rem; }

/* ================================================
   INPUTS – solo línea inferior
   ================================================ */
.buddypress input[type="text"],
.buddypress input[type="email"],
.buddypress input[type="password"],
.buddypress input[type="search"],
.buddypress input[type="url"],
.buddypress textarea,
.buddypress select,
#registerform input[type="text"],
#registerform input[type="email"],
#registerform input[type="password"],
#loginform input[type="text"],
#loginform input[type="password"],
.ea-login-form input,
.ea-register-form input,
.ea-register-form select {
  appearance: none;
  -webkit-appearance: none;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--cream-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 10px 0 8px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  color: var(--ink) !important;
  width: 100% !important;
  transition: border-color var(--transition) !important;
}

.buddypress input:focus,
.ea-login-form input:focus,
.ea-register-form input:focus {
  border-bottom-color: var(--ink) !important;
  box-shadow: none !important;
}

.buddypress input::placeholder,
.ea-login-form input::placeholder,
.ea-register-form input::placeholder {
  color: var(--ink-muted) !important;
  font-weight: 300;
}

/* Labels */
.buddypress label,
.ea-login-form label,
.ea-register-form label,
.ea-field-label {
  font-family: var(--sans) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--ink-muted) !important;
  display: block !important;
  margin-bottom: 4px !important;
}

/* Grupos de campo */
.ea-field-group,
.buddypress .register-section .editfield,
.buddypress #signup_form .editfield {
  margin-bottom: 28px;
}

/* ================================================
   BOTONES
   ================================================ */
.buddypress a.button,
.buddypress input[type="submit"],
.buddypress button[type="submit"],
.buddypress .generic-button a,
.buddypress .comment-reply-link,
.ea-btn,
#registerform input[type="submit"],
#loginform input[type="submit"],
.ea-login-form button,
.ea-register-form button {
  display: inline-block !important;
  background: var(--ink) !important;
  color: var(--white) !important;
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding: 13px 32px !important;
  border: 1px solid var(--ink) !important;
  border-radius: var(--radius) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background var(--transition), color var(--transition) !important;
  box-shadow: none !important;
}

.buddypress a.button:hover,
.buddypress input[type="submit"]:hover,
.buddypress button[type="submit"]:hover,
.ea-btn:hover,
.ea-login-form button:hover,
.ea-register-form button:hover {
  background: transparent !important;
  color: var(--ink) !important;
}

/* Botones secundarios / outline */
.buddypress a.button.secondary,
.buddypress .secondary-action a {
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--cream-border) !important;
}

.buddypress a.button.secondary:hover {
  border-color: var(--ink) !important;
}

/* ================================================
   TARJETAS / ITEMS LISTA
   ================================================ */
.buddypress ul.item-list li,
.buddypress ul.members-list li,
.buddypress ul.groups-list li,
.buddypress ul.activity-list li {
  background: var(--white) !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  padding: 20px 24px !important;
  margin-bottom: 10px !important;
  box-shadow: var(--shadow-soft) !important;
  transition: box-shadow var(--transition) !important;
  list-style: none !important;
}

.buddypress ul.item-list li:hover {
  box-shadow: var(--shadow-card) !important;
}

/* ================================================
   ACTIVIDAD
   ================================================ */
#buddypress #activity-stream .activity-item {
  background: var(--white) !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  padding: 20px 24px !important;
  margin-bottom: 10px !important;
  box-shadow: var(--shadow-soft) !important;
}

#buddypress #activity-stream .activity-item .activity-header {
  font-family: var(--sans) !important;
  font-size: 12px !important;
  color: var(--ink-muted) !important;
  margin-bottom: 10px !important;
}

#buddypress #activity-stream .activity-item .activity-header a {
  color: var(--ink) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

#buddypress #activity-stream .activity-content {
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* Post de actividad textarea */
#buddypress #whats-new-content textarea,
#buddypress #whats-new-textarea {
  background: var(--cream) !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  padding: 14px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  color: var(--ink) !important;
  width: 100% !important;
  resize: vertical !important;
  transition: border-color var(--transition) !important;
}

#buddypress #whats-new-content textarea:focus {
  border-color: var(--ink) !important;
  outline: none !important;
}

/* Tabs de actividad */
#buddypress #activity-filter-select,
#buddypress .activity-type-filter {
  font-family: var(--sans) !important;
  font-size: 12px !important;
}

/* ================================================
   NAVEGACIÓN / TABS
   ================================================ */
#buddypress div.item-list-tabs ul,
#buddypress #subnav ul,
#buddypress #object-nav ul {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--cream-border) !important;
  padding: 0 !important;
  margin: 0 0 28px !important;
  display: flex !important;
  gap: 0 !important;
  list-style: none !important;
}

#buddypress div.item-list-tabs ul li a,
#buddypress #subnav ul li a,
#buddypress #object-nav ul li a {
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--ink-muted) !important;
  text-decoration: none !important;
  padding: 10px 18px !important;
  display: block !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px !important;
  transition: color var(--transition), border-color var(--transition) !important;
  background: transparent !important;
}

#buddypress div.item-list-tabs ul li.current a,
#buddypress div.item-list-tabs ul li a:hover,
#buddypress #subnav ul li.current a,
#buddypress #subnav ul li a:hover,
#buddypress #object-nav ul li.current a,
#buddypress #object-nav ul li a:hover {
  color: var(--ink) !important;
  border-bottom-color: var(--ink) !important;
  background: transparent !important;
}

#buddypress div.item-list-tabs ul li.current a {
  border-bottom-color: var(--ink) !important;
}

/* ================================================
   PERFIL DE USUARIO
   ================================================ */
#buddypress #item-header {
  background: var(--white) !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  padding: 36px 32px !important;
  margin-bottom: 28px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 28px !important;
  box-shadow: var(--shadow-soft) !important;
}

#buddypress #item-header #item-avatar img {
  border-radius: 50% !important;
  width: 88px !important;
  height: 88px !important;
  object-fit: cover !important;
  border: 2px solid var(--cream-border) !important;
}

#buddypress #item-header #item-meta h1,
#buddypress #item-header #item-meta h2 {
  font-family: var(--serif) !important;
  font-size: 2rem !important;
  font-weight: 400 !important;
  margin: 0 0 6px !important;
}

#buddypress #item-header #item-meta .activity {
  font-size: 12px !important;
  color: var(--ink-muted) !important;
  font-family: var(--sans) !important;
}

/* ================================================
   LISTA DE MIEMBROS
   ================================================ */
#buddypress #members-list .member-header {
  font-family: var(--serif) !important;
  font-size: 1.1rem !important;
  font-weight: 500 !important;
}

#buddypress #members-list .user-list-avatar img,
#buddypress .members-list .user-list-avatar img {
  border-radius: 50% !important;
  border: 1px solid var(--cream-border) !important;
}

/* ================================================
   GRUPOS
   ================================================ */
#buddypress #groups-list .group-avatar img,
#buddypress .groups-list .group-avatar img {
  border-radius: var(--radius) !important;
  border: 1px solid var(--cream-border) !important;
}

#buddypress #groups-list .item-title a,
#buddypress .groups-list .item-title a {
  font-family: var(--serif) !important;
  font-size: 1.2rem !important;
  font-weight: 500 !important;
  color: var(--ink) !important;
  text-decoration: none !important;
}

#buddypress #groups-list .item-meta,
#buddypress .groups-list .item-meta {
  font-size: 12px !important;
  color: var(--ink-muted) !important;
  font-family: var(--sans) !important;
}

/* ================================================
   FORMULARIOS REGISTRO / LOGIN
   ================================================ */
.ea-auth-wrapper {
  min-height: 100vh;
  background: var(--cream);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 24px;
}

.ea-auth-card {
  background: var(--white);
  border: 1px solid var(--cream-border);
  border-radius: var(--radius);
  padding: 52px 48px;
  width: 100%;
  max-width: 440px;
  box-shadow: var(--shadow-card);
}

.ea-auth-card .ea-auth-logo {
  text-align: center;
  margin-bottom: 36px;
}

.ea-auth-card .ea-auth-logo img {
  height: 52px;
  width: auto;
}

.ea-auth-card .ea-auth-logo .ea-auth-logotype {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--ink);
}

.ea-auth-card .ea-auth-logo .ea-auth-logotype span {
  font-style: italic;
  font-weight: 300;
}

.ea-auth-title {
  font-family: var(--serif);
  font-size: 1.9rem;
  font-weight: 400;
  color: var(--ink);
  text-align: center;
  margin: 0 0 8px;
}

.ea-auth-subtitle {
  font-size: 12px;
  color: var(--ink-muted);
  text-align: center;
  margin: 0 0 36px;
  letter-spacing: 0.02em;
}

.ea-field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.ea-field-group {
  margin-bottom: 28px;
}

.ea-field-group label,
.ea-field-label {
  font-family: var(--sans);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  display: block;
  margin-bottom: 6px;
}

.ea-field-group input {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--cream-border);
  border-radius: 0;
  box-shadow: none;
  outline: none;
  padding: 10px 0 8px;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 300;
  color: var(--ink);
  width: 100%;
  transition: border-color var(--transition);
}

.ea-field-group input:focus {
  border-bottom-color: var(--ink);
}

.ea-field-group input::placeholder {
  color: var(--ink-muted);
}

.ea-submit-wrap {
  margin-top: 36px;
}

.ea-submit-wrap button,
.ea-submit-wrap input[type="submit"] {
  width: 100%;
  background: var(--ink);
  color: var(--white);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 15px 32px;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
}

.ea-submit-wrap button:hover,
.ea-submit-wrap input[type="submit"]:hover {
  background: transparent;
  color: var(--ink);
}

.ea-auth-footer {
  margin-top: 28px;
  text-align: center;
  font-size: 12px;
  color: var(--ink-muted);
}

.ea-auth-footer a {
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--cream-border);
  transition: border-color var(--transition);
}

.ea-auth-footer a:hover {
  border-bottom-color: var(--ink);
}

.ea-divider {
  border: none;
  border-top: 1px solid var(--cream-border);
  margin: 28px 0;
}

/* Mensajes de error BuddyPress */
.buddypress div.error,
.buddypress div#bp-registration-validation,
#buddypress div.error {
  background: #FFF5F5 !important;
  border: 1px solid #E8C0C0 !important;
  border-radius: var(--radius) !important;
  padding: 12px 16px !important;
  font-size: 12px !important;
  color: #8B3333 !important;
  margin-bottom: 20px !important;
}

.buddypress div.updated,
#buddypress div.updated {
  background: #F5FFF8 !important;
  border: 1px solid #B0D9BE !important;
  border-radius: var(--radius) !important;
  padding: 12px 16px !important;
  font-size: 12px !important;
  color: #2D6A3F !important;
  margin-bottom: 20px !important;
}

/* ================================================
   FORMULARIO INTERNO BUDDYPRESS (register.php nativo)
   ================================================ */
#buddypress #signup_form,
#buddypress #registerform {
  max-width: 460px;
  margin: 0 auto;
  background: var(--white);
  border: 1px solid var(--cream-border);
  border-radius: var(--radius);
  padding: 48px;
  box-shadow: var(--shadow-card);
}

#buddypress #signup_form .register-section,
#buddypress #registerform .register-section {
  margin-bottom: 32px;
}

#buddypress #signup_form .register-section h4,
#buddypress #registerform h2,
.ea-section-title {
  font-family: var(--serif) !important;
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  color: var(--ink-muted) !important;
  margin: 0 0 20px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--cream-border) !important;
}

/* ================================================
   BÚSQUEDA
   ================================================ */
#buddypress #members-directory-form,
#buddypress #groups-directory-form {
  margin-bottom: 28px;
}

#buddypress #members-directory-form input[type="search"],
#buddypress #groups-directory-form input[type="search"] {
  background: var(--white) !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  padding: 10px 16px !important;
  font-family: var(--sans) !important;
  font-size: 13px !important;
  width: 260px !important;
  color: var(--ink) !important;
}

/* ================================================
   PAGINACIÓN
   ================================================ */
#buddypress .pagination .page-numbers,
#buddypress .pagination a {
  font-family: var(--sans) !important;
  font-size: 12px !important;
  color: var(--ink-muted) !important;
  padding: 6px 12px !important;
  border: 1px solid var(--cream-border) !important;
  border-radius: var(--radius) !important;
  text-decoration: none !important;
  display: inline-block !important;
  transition: all var(--transition) !important;
}

#buddypress .pagination .page-numbers.current,
#buddypress .pagination a:hover {
  background: var(--ink) !important;
  color: var(--white) !important;
  border-color: var(--ink) !important;
}

/* ================================================
   FOOTER MINIMALISTA
   ================================================ */
body.buddypress #footer,
body.bp-user #footer,
body.registration #footer,
body.members #footer,
body.groups #footer {
  background: var(--cream-dark) !important;
  border-top: 1px solid var(--cream-border) !important;
  padding: 28px 40px !important;
  font-size: 11px !important;
  color: var(--ink-muted) !important;
  font-family: var(--sans) !important;
  letter-spacing: 0.06em !important;
}

/* ================================================
   UTILIDADES
   ================================================ */
.ea-center { text-align: center; }
.ea-mt-4  { margin-top: 4px; }
.ea-mt-8  { margin-top: 8px; }
.ea-mt-16 { margin-top: 16px; }
.ea-mt-32 { margin-top: 32px; }

/* ================================================
   RESPONSIVE
   ================================================ */
@media (max-width: 640px) {
  .ea-auth-card {
    padding: 32px 24px;
  }
  .ea-field-row {
    grid-template-columns: 1fr;
  }
  .ea-site-header {
    padding: 14px 20px;
  }
  .ea-header-nav {
    display: none;
  }
  #buddypress #item-header {
    flex-direction: column !important;
  }
}