/* Página /red_social — grid de 3 columnas (ex portada) */

body.page-red-social {
  background: var(--color-surface, #fff) !important;
}

body.page-red-social::before {
  display: none !important;
  content: none !important;
}

body.page-red-social .red-social-page {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: var(--color-surface, #fff);
  box-sizing: border-box;
}

body.page-red-social .home-section--portada-grid {
  display: block !important;
  margin: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: var(--color-surface, #fff);
  --home-portada-grid-pad-top: 15px;
  --home-portada-grid-pad-bottom: 8px;
}

body.page-red-social .home-portada-scroll-btn--up {
  display: none !important;
}

body.page-red-social > footer {
  margin-top: 0;
}

/* Celular / tablet: cabecera fija (fixed) — sticky falla con overflow-x en body */
@media (max-width: 1024px) {
  body.page-red-social > header.site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 1000;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    will-change: auto !important;
    transition: none !important;
  }

  body.page-red-social {
    padding-top: var(--header-height, 96px);
    box-sizing: border-box;
  }
}

/* Nombre y descripción de publicaciones a la izquierda (escritorio y móvil) */
body.page-red-social .pub-feed__head-text,
body.page-red-social .pub-feed__author,
body.page-red-social .pub-feed__author-row,
body.page-red-social .pub-feed__time,
body.page-red-social .pub-feed__body,
body.page-red-social .pub-feed__content-wrap,
body.page-red-social .pub-feed__content,
body.page-red-social .pub-feed__toggle-text {
  text-align: left !important;
}

/* Imágenes del feed siempre visibles (evitar fallos lazy/altura 0) */
body.page-red-social .pub-feed__media,
body.page-red-social .pub-feed__media img {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 100% !important;
  width: 100%;
  height: auto;
}

/* Sin zoom/movimiento al pasar el cursor */
body.page-red-social .pub-feed__media:hover img,
body.page-red-social .pub-feed__media img:hover {
  transform: none !important;
}

/* Cabeceras de sección: fondo dorado, texto blanco */
body.page-red-social .home-portada-block__head,
body.page-red-social .home-portada-block--publicaciones .home-portada-block__head,
body.page-red-social .home-portada-grid__col--left .home-portada-block__head,
body.page-red-social .home-portada-grid__col--right .home-portada-block__head {
  background: var(--color-brand-gold, #B9984B) !important;
}

body.page-red-social .home-portada-block__title,
body.page-red-social .home-portada-block__title i,
body.page-red-social .home-portada-block__link {
  color: #fff !important;
}

body.page-red-social .home-portada-block__link:hover {
  color: #fff !important;
  opacity: 0.9;
}

/* Escritorio: columnas a pantalla completa bajo el menú, scroll por columna sin barra */
@media (min-width: 992px) {
  body.page-red-social {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
  }

  body.page-red-social > header.site-header {
    flex-shrink: 0;
  }

  body.page-red-social > .red-social-page {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
  }

  body.page-red-social .home-section--portada-grid {
    flex: 1 1 auto;
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    padding: 15px 8px 8px;
    overflow: hidden;
  }

  body.page-red-social .home-section--portada-grid > .container {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-width: none !important;
    width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  body.page-red-social .home-portada-grid {
    flex: 1 1 auto !important;
    width: 100%;
    min-width: 0;
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    gap: 12px;
  }

  body.page-red-social .home-portada-grid__col {
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-red-social .home-portada-grid__col::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }

  body.page-red-social .home-portada-grid__col--pub {
    overflow-y: hidden;
    display: flex;
    flex-direction: column;
  }

  body.page-red-social .home-portada-grid__col--pub .home-portada-block--publicaciones {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  body.page-red-social .home-portada-grid__col--pub .home-portada-block__body--pub {
    flex: 1 1 auto;
    min-height: 0;
    /* block (no flex): evita altura 0 en <img> dentro de overflow en Chromium/WebKit desktop */
    display: block !important;
    overflow-x: visible;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.page-red-social .home-portada-grid__col--pub .home-portada-block__body--pub::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }

  /* Feed a la izquierda */
  body.page-red-social .home-portada-grid__col--pub .pub-feed {
    max-width: none;
    width: 100%;
    margin: 0;
    margin-inline: 0;
    display: flex !important;
    flex-direction: column;
    flex: 0 0 auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.page-red-social .pub-feed__card {
    flex-shrink: 0;
    overflow: visible;
  }

  body.page-red-social .pub-feed__media {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 160px;
    max-height: none;
    margin: 8px 0 4px;
    overflow: visible !important;
    background: #f0f2f5;
  }

  body.page-red-social .pub-feed__media img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 120px;
    max-height: 560px !important;
    object-fit: contain !important;
    object-position: center center;
  }

  body.page-red-social .home-portada-pub__pagination,
  body.page-red-social #pagination-container {
    display: none !important;
  }

  body.page-red-social .pub-feed__sentinel {
    display: block;
    height: 1px;
    width: 100%;
    flex-shrink: 0;
    pointer-events: none;
  }

  body.page-red-social .pub-feed__more-status {
    display: block;
    text-align: center;
    color: var(--color-text-medium, #6b7280);
    font-size: 0.85rem;
    padding: 10px 8px 16px;
    margin: 0;
  }

  body.page-red-social .pub-feed__more-status[hidden] {
    display: none !important;
  }

  /* El pie no compite con el viewport del feed en escritorio */
  body.page-red-social > footer {
    display: none;
  }
}

/* Celular: solo publicaciones, scroll de página normal */
@media (max-width: 991px) {
  body.page-red-social {
    overflow-x: hidden;
    max-width: 100%;
    background: var(--color-surface, #f5f5f5) !important;
  }

  body.page-red-social .home-section--portada-grid {
    padding: 0;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent;
  }

  /* Celular: sin título «Publicaciones Comunidad», solo el feed + composer */
  body.page-red-social .home-portada-block--publicaciones > .home-portada-block__head {
    display: none !important;
  }

  body.page-red-social .home-pub-composer-slot,
  body.page-red-social .home-pub-composer-wrap,
  body.page-red-social .cuenta-pub-composer {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100%;
    box-sizing: border-box;
  }

  body.page-red-social .home-pub-composer-slot {
    margin: 0 0 12px;
    padding: 0 10px;
  }

  /* Composer: solo icono de foto + Publicar en una fila */
  body.page-red-social .cuenta-pub-composer__toolbar-label {
    display: none !important;
  }

  body.page-red-social .cuenta-pub-composer__actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px;
  }

  body.page-red-social .cuenta-pub-composer__actions-left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 auto;
    min-width: 0;
  }

  body.page-red-social .cuenta-pub-composer__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    margin: 0;
  }

  body.page-red-social .cuenta-pub-composer__submit {
    width: auto;
    white-space: nowrap;
  }

  body.page-red-social .home-section--portada-grid > .container {
    max-width: none !important;
    width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    height: auto !important;
  }

  body.page-red-social .home-portada-grid__col--left,
  body.page-red-social .home-portada-grid__col--right {
    display: none !important;
  }

  body.page-red-social .home-portada-grid,
  body.page-red-social .home-portada-grid--3col {
    display: block !important;
    width: 100%;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    gap: 0;
  }

  body.page-red-social .home-portada-grid__col--pub {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* Sin card contenedora: publicaciones sueltas sobre el fondo */
  body.page-red-social .home-portada-grid__col--pub .home-portada-block--publicaciones {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body.page-red-social .home-portada-grid__col--pub .home-portada-block__body--pub {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 10px 10px 24px !important;
  }

  body.page-red-social #pub-feed-root,
  body.page-red-social .pub-feed {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    gap: 12px;
  }

  body.page-red-social .home-portada-pub__pagination,
  body.page-red-social #pagination-container {
    display: none !important;
  }

  body.page-red-social .pub-feed__sentinel {
    display: block;
    height: 1px;
    width: 100%;
    pointer-events: none;
  }

  body.page-red-social .pub-feed__more-status {
    display: block;
    text-align: center;
    color: var(--color-text-medium, #6b7280);
    font-size: 0.9rem;
    padding: 12px 8px 20px;
    margin: 0;
  }

  body.page-red-social .pub-feed__more-status[hidden] {
    display: none !important;
  }

  /* Acciones Me gusta / Comentar / Compartir en una sola fila */
  body.page-red-social .pub-feed__actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100%;
    box-sizing: border-box;
  }

  body.page-red-social .pub-feed__action {
    justify-content: center !important;
    align-items: center;
    gap: 4px;
    min-width: 0;
    padding: 10px 4px !important;
    font-size: 0.72rem;
    white-space: nowrap;
    overflow: hidden;
  }

  body.page-red-social .pub-feed__action i {
    flex-shrink: 0;
    font-size: 0.88rem;
  }
}