@charset "utf-8";
/* ==========================================================
   BRINTAGE R208 — continuidad visual del chat
   1) barra superior: misma familia visual, más oscura y sin halo
   2) acciones de posts: corazón/comentario/compartir lineales
      respetando las dimensiones originales de cada botón
   3) posts reales + mini posts: borde del bloque Sugerencias
   ========================================================== */
:root{
  --bt-r208-upper-icon:#3f536b;
  --bt-r208-card-border:#dfe9f5;
  --bt-r208-card-shadow:0 14px 35px rgba(15,23,42,.07);
}

/* ----------------------------------------------------------
   Cabecera Home: no cambiamos el 26x26 histórico del botón.
   El símbolo se dibuja dentro de ese mismo cuadro, sin sombra
   ni fondo, y un tono más oscuro que la navegación inferior.
   ---------------------------------------------------------- */
body.bt-home #bop .pos-m-b.menu.home-actions > a{
  background-image:none!important;
  background-color:transparent!important;
  color:var(--bt-r208-upper-icon)!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
  filter:none!important;
  overflow:visible!important;
  transition:color .16s ease,opacity .16s ease!important;
}
body.bt-home #bop .pos-m-b.menu.home-actions > a::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:100%;
  max-width:22px;
  max-height:22px;
  transform:translate(-50%,-50%);
  display:block;
  background:currentColor;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:contain;
  mask-size:contain;
  pointer-events:none;
}
body.bt-home #bop .pos-m-b.menu.home-actions > a:nth-of-type(1)::before{
  max-width:22px;
  max-height:22px;
  -webkit-mask-image:url('../icos/create-post-thin.svg');
  mask-image:url('../icos/create-post-thin.svg');
}
body.bt-home #bop .pos-m-b.menu.home-actions > a:nth-of-type(2)::before{
  max-width:22px;
  max-height:22px;
  -webkit-mask-image:url('../icos/notifications-thin.svg');
  mask-image:url('../icos/notifications-thin.svg');
}
body.bt-home #bop .pos-m-b.menu.home-actions > a:nth-of-type(3)::before{
  max-width:22px;
  max-height:22px;
  -webkit-mask-image:url('../icos/chats-thin.svg');
  mask-image:url('../icos/chats-thin.svg');
}
body.bt-home #bop .pos-m-b.menu.home-actions > a:hover,
body.bt-home #bop .pos-m-b.menu.home-actions > a:active{
  color:#31475f!important;
  background:transparent!important;
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
}
body.bt-home #bop .pos-m-b.menu.home-actions > a .nN{
  z-index:3;
}

/* ----------------------------------------------------------
   R222 — BOTONES ANTIGUOS DE POSTS RESTAURADOS
   Los botones de like / comentario / compartir vuelven a usar
   los SVG originales de Brintage directamente desde icos/.
   No se redibujan con masks ni pseudo-elementos.
   El tamaño y comportamiento quedan a cargo del CSS/JS
   histórico de post.css + post.js.
   ---------------------------------------------------------- */
/* ----------------------------------------------------------
   Borde tomado literalmente de Sugerencias para ti:
   #dfe9f5 + radio 18px + la misma sombra suave.
   ---------------------------------------------------------- */
.post{
  border:1px solid var(--bt-r208-card-border)!important;
  border-radius:18px!important;
  box-shadow:var(--bt-r208-card-shadow)!important;
  -webkit-box-shadow:var(--bt-r208-card-shadow)!important;
}

/* El mini post ya tenía un marco blanco de 6px. No alteramos su
   ancho ni el área del collage: agregamos el filo exterior con
   box-shadow para conservar todas sus proporciones. */
.cl-min-clge{
  border-radius:18px!important;
  box-shadow:0 0 0 1px var(--bt-r208-card-border),var(--bt-r208-card-shadow)!important;
  -webkit-box-shadow:0 0 0 1px var(--bt-r208-card-border),var(--bt-r208-card-shadow)!important;
}
.cl-min-clge .cl-mini-canvas{
  border-radius:11px 11px 0 0!important;
}

/* No pintar borde real sobre fantasmas/skeletons: mantienen su
   lectura de carga y no parecen contenido terminado. */
.br-home-skeleton-post,
.br-post-skeleton-post,
.br-usposts-skeleton-post{
  box-shadow:none!important;
  -webkit-box-shadow:none!important;
}