/*
 * Listnova shared header feeds — design10.214.
 * Canonical visual contract for Messages / Notifications in every Listnova header.
 * This file is loaded after both theme and account styles on purpose.
 */

.ln-account-v2-header-popover__panel{
  box-sizing:border-box!important;
  border:1px solid var(--acc-border,var(--ln-front-border,#ececf1))!important;
  background:var(--acc-surface,var(--ln-front-surface,#fff))!important;
  color:var(--acc-text,var(--ln-front-text,#101522))!important;
  transform-origin:top right;
  animation:lnSharedHeaderFeedIn .16s ease-out both;
}
.ln-account-v2-header-popover__panel *,
.ln-account-v2-header-popover__panel *::before,
.ln-account-v2-header-popover__panel *::after{box-sizing:border-box}
.ln-account-v2-header-popover__panel .ln-read-notifications-form{margin:0!important}

.ln-account-v2-header-popover__panel{
  width:min(430px,calc(100vw - 30px))!important;
  max-height:min(78vh,760px)!important;
  overflow:hidden!important;
  border-radius:26px!important;
  box-shadow:0 26px 60px rgba(20,26,36,.16)!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  min-height:0!important;
  background:transparent!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__head{
  padding:20px 20px 16px!important;
  border-bottom:1px solid var(--acc-border)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.96))!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__head>div{
  display:grid!important;
  gap:6px!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__head small{
  margin:0!important;
  color:var(--acc-muted)!important;
  font-size:.76rem!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__head h3{
  margin:0!important;
  color:var(--acc-text)!important;
  font-size:1.05rem!important;
  font-weight:900!important;
  line-height:1.05!important;
  letter-spacing:-.03em!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__meta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  padding:0 12px!important;
  border:1px solid var(--acc-border)!important;
  border-radius:999px!important;
  background:var(--acc-soft)!important;
  color:var(--acc-muted)!important;
  font-size:.78rem!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__list{
  display:grid!important;
  gap:10px!important;
  min-height:0!important;
  padding:12px!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__item{
  grid-template-columns:52px minmax(0,1fr) auto!important;
  gap:12px!important;
  align-items:start!important;
  padding:12px!important;
  margin:0!important;
  border:1px solid var(--acc-border)!important;
  border-top:1px solid var(--acc-border)!important;
  border-radius:18px!important;
  background:var(--acc-surface)!important;
  color:var(--acc-text)!important;
  text-decoration:none!important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__item:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 12px 28px rgba(20,26,36,.06)!important;
  border-color:rgba(255,59,130,.22)!important;
  background:var(--acc-soft)!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__item.is-unread{
  border-color:rgba(255,59,130,.22)!important;
  background:linear-gradient(180deg,var(--acc-surface),rgba(255,59,130,.035))!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__notification-icon,
.ln-account-v2-header-popover__panel .ln-header-feed__avatar{
  display:grid!important;
  place-items:center!important;
  width:52px!important;
  height:52px!important;
  border-radius:16px!important;
  background:var(--acc-soft)!important;
  overflow:hidden!important;
  flex:none!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed--notifications .ln-header-feed__notification-icon{
  color:var(--acc-accent)!important;
  font-size:1.28rem!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__avatar img,
.ln-account-v2-header-popover__panel .ln-header-feed__avatar .avatar,
.ln-account-v2-header-popover__panel .ln-header-feed__avatar-image{
  display:block!important;
  width:52px!important;
  height:52px!important;
  border-radius:16px!important;
  object-fit:cover!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__copy{
  display:grid!important;
  gap:6px!important;
  min-width:0!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__top{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:0!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__top strong{
  display:block!important;
  min-width:0!important;
  color:var(--acc-text)!important;
  font-size:.98rem!important;
  font-weight:900!important;
  line-height:1.2!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__top time{
  flex:none!important;
  margin:1px 0 0!important;
  color:var(--acc-muted)!important;
  font-size:.78rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__copy>small{
  display:block!important;
  margin:0!important;
  color:#7f8f88!important;
  font-size:.78rem!important;
  font-weight:800!important;
  line-height:1.35!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__preview{
  display:-webkit-box!important;
  margin:0!important;
  overflow:hidden!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  color:var(--acc-muted)!important;
  font-size:.9rem!important;
  line-height:1.45!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__preview b{
  color:var(--acc-text)!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__counter,
.ln-account-v2-header-popover__panel .ln-header-feed__dot{
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  justify-self:end!important;
  flex:none!important;
  min-width:24px!important;
  width:24px!important;
  height:24px!important;
  padding:0 6px!important;
  border:4px solid rgba(255,59,130,.10)!important;
  border-radius:999px!important;
  background:var(--acc-accent)!important;
  color:#fff!important;
  font-size:.68rem!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:1!important;
  box-sizing:border-box!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__dot{
  min-width:12px!important;
  width:12px!important;
  height:12px!important;
  padding:0!important;
  border-width:3px!important;
  color:transparent!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__empty{
  display:grid!important;
  place-items:center!important;
  gap:8px!important;
  min-height:240px!important;
  padding:28px 18px!important;
  border:1px dashed var(--acc-border)!important;
  border-radius:20px!important;
  background:var(--acc-soft)!important;
  text-align:center!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__empty i{
  display:grid!important;
  place-items:center!important;
  width:54px!important;
  height:54px!important;
  border-radius:17px!important;
  background:var(--acc-surface)!important;
  color:var(--acc-accent)!important;
  font-size:1.4rem!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__empty strong{
  color:var(--acc-text)!important;
  font-size:1rem!important;
  font-weight:900!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__empty span{
  max-width:240px!important;
  color:var(--acc-muted)!important;
  font-size:.88rem!important;
  line-height:1.45!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__read-all{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:42px!important;
  padding:0 14px!important;
  border:1px solid rgba(255,59,130,.22)!important;
  border-radius:16px!important;
  background:#fff3f8!important;
  color:var(--acc-accent)!important;
  font-size:.84rem!important;
  font-weight:850!important;
  box-shadow:none!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__read-all:hover{
  background:#ffeaf3!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__footer{
  padding:12px!important;
  border-top:1px solid var(--acc-border)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,250,252,.98))!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__footer a{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:52px!important;
  width:100%!important;
  border:1px solid var(--acc-border)!important;
  border-radius:18px!important;
  background:var(--acc-surface)!important;
  color:var(--acc-text)!important;
  font-size:.95rem!important;
  font-weight:900!important;
  text-decoration:none!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed__footer a:hover{
  background:var(--acc-soft)!important;
}

/* Spécifique Messages */
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__item{
  grid-template-columns:56px minmax(0,1fr) auto!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar,
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar img,
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar .avatar,
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar-image{
  width:56px!important;
  height:56px!important;
  border-radius:18px!important;
}
.ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__copy>small{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:100%!important;
  padding:0!important;
  background:transparent!important;
  color:#85938d!important;
}

/* Dark mode */
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel{
  background:#20282d!important;
  border-color:#39454c!important;
  box-shadow:0 28px 60px rgba(0,0,0,.36)!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__head{
  background:linear-gradient(180deg,#20282d,#222b31)!important;
  border-bottom-color:#39454c!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__item{
  background:#232c31!important;
  border-color:#364149!important;
  color:#f2f5f7!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__item:hover{
  background:#293239!important;
  border-color:#46525b!important;
  box-shadow:none!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__item.is-unread{
  background:linear-gradient(180deg,#232c31,rgba(255,91,148,.08))!important;
  border-color:#5a3b48!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__notification-icon,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__avatar{
  background:#2b3439!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__top strong,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__empty strong,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__footer a{
  color:#f2f5f7!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__top time,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__copy>small,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__preview,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__empty span,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__head small,
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__meta{
  color:#a6b2bc!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__meta{
  background:#2a3439!important;
  border-color:#3b474e!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__read-all{
  background:rgba(255,91,148,.10)!important;
  border-color:rgba(255,91,148,.22)!important;
  color:#ff7faa!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__footer{
  background:linear-gradient(180deg,#20282d,#1d2529)!important;
  border-top-color:#39454c!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__footer a{
  background:#232c31!important;
  border-color:#39454c!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__footer a:hover{
  background:#293239!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__empty{
  background:#232c31!important;
  border-color:#39454c!important;
}
html[data-ln-theme="dark"] .ln-account-v2-header-popover__panel .ln-header-feed__empty i{
  background:#2a3439!important;
}

@media(max-width:860px){
  .ln-account-v2-header-popover__panel{
    width:min(380px,calc(100vw - 18px))!important;
    max-height:min(74vh,720px)!important;
  }
}
@media(max-width:640px){
  .ln-account-v2-header-popover__panel{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100vh - 110px)!important;
    border-radius:24px!important;
  }
  .ln-account-v2-header-popover__panel .ln-header-feed__head{
    padding:18px 16px 14px!important;
    align-items:flex-start!important;
    gap:10px!important;
  }
  .ln-account-v2-header-popover__panel .ln-header-feed__head h3{font-size:.98rem!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__read-all,
  .ln-account-v2-header-popover__panel .ln-header-feed__meta{
    min-height:38px!important;
    padding:0 12px!important;
    font-size:.77rem!important;
  }
  .ln-account-v2-header-popover__panel .ln-header-feed__list{padding:10px!important;gap:9px!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__item{
    grid-template-columns:48px minmax(0,1fr) auto!important;
    gap:10px!important;
    padding:11px!important;
    border-radius:16px!important;
  }
  .ln-account-v2-header-popover__panel .ln-header-feed__notification-icon,
  .ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar,
  .ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar img,
  .ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar .avatar,
  .ln-account-v2-header-popover__panel .ln-header-feed--messages .ln-header-feed__avatar-image,
  .ln-account-v2-header-popover__panel .ln-header-feed__avatar,
  .ln-account-v2-header-popover__panel .ln-header-feed__avatar img,
  .ln-account-v2-header-popover__panel .ln-header-feed__avatar .avatar,
  .ln-account-v2-header-popover__panel .ln-header-feed__avatar-image{
    width:48px!important;
    height:48px!important;
    border-radius:15px!important;
  }
  .ln-account-v2-header-popover__panel .ln-header-feed__top{gap:8px!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__top strong{font-size:.92rem!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__top time{font-size:.74rem!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__copy>small{font-size:.74rem!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__preview{font-size:.86rem!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__footer{padding:10px!important}
  .ln-account-v2-header-popover__panel .ln-header-feed__footer a{min-height:48px!important;font-size:.92rem!important;border-radius:16px!important}
}

/* Same viewport behaviour on the public header and account header. */
@media(max-width:640px){
  body.ln-account-page-v2 .ln-account-v2-header-popover__panel,
  body.ln-account-workspace-v2 .ln-account-v2-header-popover__panel,
  .site-header--v3 .ln-account-v2-header-popover__panel{
    position:fixed!important;
    top:var(--ln-shared-header-popover-top,84px)!important;
    right:8px!important;
    bottom:auto!important;
    left:8px!important;
    z-index:2147482000!important;
    display:block!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100dvh - var(--ln-shared-header-popover-top,84px) - 10px)!important;
    margin:0!important;
    overflow:hidden!important;
    border-radius:22px!important;
    transform:none!important;
    translate:none!important;
    clip:auto!important;
    clip-path:none!important;
  }
  body.ln-account-page-v2 .ln-account-v2-header-popover:not([open]) .ln-account-v2-header-popover__panel,
  body.ln-account-workspace-v2 .ln-account-v2-header-popover:not([open]) .ln-account-v2-header-popover__panel,
  .site-header--v3 .ln-account-v2-header-popover:not([open]) .ln-account-v2-header-popover__panel{
    display:none!important;
  }
  body.ln-account-page-v2 .ln-account-v2-header-popover__panel .ln-header-feed,
  body.ln-account-workspace-v2 .ln-account-v2-header-popover__panel .ln-header-feed,
  .site-header--v3 .ln-account-v2-header-popover__panel .ln-header-feed{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    max-height:inherit!important;
  }
  body.ln-account-page-v2 .ln-account-v2-header-popover__panel .ln-header-feed__list,
  body.ln-account-workspace-v2 .ln-account-v2-header-popover__panel .ln-header-feed__list,
  .site-header--v3 .ln-account-v2-header-popover__panel .ln-header-feed__list{
    max-height:calc(100dvh - var(--ln-shared-header-popover-top,84px) - 174px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
}

@keyframes lnSharedHeaderFeedIn{
  from{opacity:0;transform:translateY(-5px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .ln-account-v2-header-popover__panel,
  .ln-account-v2-header-popover__panel *{animation:none!important;transition:none!important}
}