/* wire-smooth-notifications-center-303f1h715 */

html.wire-notifications-loading-303f1h715
main.content-column{
  opacity:.82 !important;
  transform:translateY(2px) !important;
  pointer-events:none !important;
}

main.content-column{
  transition:
    opacity .15s ease,
    transform .15s ease !important;
}

.notification-card.wire-marking-read-303f1h715{
  opacity:.55 !important;
  transform:translateX(4px) !important;
  transition:
    opacity .14s ease,
    transform .14s ease !important;
}

.notification-card.wire-opening-303f1h715{
  background:rgba(255,255,255,.035) !important;
}

.notification-read-form button[aria-busy="true"],
form[data-mark-all-read] button[aria-busy="true"]{
  opacity:.62 !important;
  pointer-events:none !important;
}

@media(max-width:799px){
  .notification-page-header{
    align-items:flex-start !important;
    gap:10px !important;
    padding:
      max(10px,env(safe-area-inset-top))
      14px
      12px !important;
  }

  .notification-page-header h1{
    font-size:24px !important;
    line-height:1.1 !important;
  }

  .notification-header-actions{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:flex-end !important;
    gap:7px !important;
  }

  .notification-header-actions .outline-button,
  .notification-header-actions .primary-button{
    min-height:38px !important;
    padding:0 11px !important;
    font-size:11px !important;
  }

  .notification-filters{
    overflow-x:auto !important;
    scrollbar-width:none !important;
    overscroll-behavior-x:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .notification-filters::-webkit-scrollbar{
    display:none !important;
  }

  .notification-filters button{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  .notification-card{
    grid-template-columns:auto auto minmax(0,1fr) auto !important;
    align-items:start !important;
    gap:9px !important;
    padding:13px !important;
  }

  .notification-card-heading{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    gap:4px 6px !important;
  }

  .notification-card-heading strong{
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .notification-card-heading [class*="verified"],
  .notification-card-heading [class*="badge"]{
    flex:0 0 auto !important;
    margin:0 !important;
  }

  .notification-card-heading span{
    flex-basis:100% !important;
  }

  .notification-post-preview{
    margin-top:5px !important;
  }

  .notification-center{
    padding-bottom:
      calc(88px + env(safe-area-inset-bottom)) !important;
  }
}

@media(prefers-reduced-motion:reduce){
  html.wire-notifications-loading-303f1h715
  main.content-column,
  main.content-column,
  .notification-card.wire-marking-read-303f1h715{
    transition:none !important;
    transform:none !important;
  }
}