/* PurrCine 3.5 — notification bell: public feed (arrivals + announcements), poster thumbs, mobile bell. */

.notif-menu { position: relative; }
.notif-badge[hidden] { display: none !important; }

/* Poster thumbnail for new-arrival items */
.notif-icon.notif-thumb { width: 34px; height: 50px; border-radius: 7px; overflow: hidden; background: rgba(255,255,255,.06); }
.notif-icon.notif-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Make items clearly clickable and readable inside the dropdown */
.notif-dropdown a.notif-item { color: inherit; text-decoration: none; cursor: pointer; }
.notif-dropdown a.notif-item:hover { background: rgba(255,255,255,.07); }
.notif-dropdown .notif-body strong { font-size: 12.5px; }
.notif-dropdown .notif-body span { font-size: 11.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.notif-dropdown .notif-item.unread { padding-right: 24px; }
.notif-footer {
  display: block; text-align: center; margin-top: 6px; padding: 11px 10px 9px;
  border-top: 1px solid var(--line, rgba(255,255,255,.09)); color: var(--gold, #7aa2ff);
  font-size: 11.5px; font-weight: 800; text-decoration: none;
}
.notif-footer:hover { color: var(--gold-soft, #a5c0ff); text-decoration: underline; }

/* Bring the bell back on phones/tablets (older rules hid it) */
@media (max-width: 1023px) {
  .nav-actions .notif-menu { display: block !important; }
  .nav-actions .notif-trigger { display: inline-grid !important; }
  .notif-dropdown {
    position: fixed; left: 10px; right: 10px; width: auto; max-width: none;
    top: calc(env(safe-area-inset-top, 0px) + var(--header-h, 64px) + 6px);
  }
  .notif-list { max-height: min(62vh, 460px); }
  .notif-dropdown .notif-item { min-height: 56px; }
}

/* Admin composer preview */
.notif-preview { max-width: 380px; background: #121218; border: 1px solid var(--line-strong, rgba(255,255,255,.16)); border-radius: 14px; padding: 8px; }

/* Pinned notifications + plan offers */
.notif-pin { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #f2b95c; }
.notif-dropdown .notif-body span.notif-pin { display: block; -webkit-line-clamp: unset; font-size: 9.5px; }
.notif-cta {
  display: inline-block; width: max-content; margin-top: 4px; padding: 5px 11px; border-radius: 999px;
  background: var(--gold, #7aa2ff); color: #0a0a0b; font-style: normal; font-size: 10.5px; font-weight: 800;
}
.notif-item.pinned { background: linear-gradient(135deg, rgba(242,185,92,.13), rgba(242,185,92,.04)); box-shadow: inset 3px 0 0 #f2b95c; }
.notif-item.promo { background: linear-gradient(135deg, rgba(122,162,255,.17), rgba(167,139,250,.08)); box-shadow: inset 3px 0 0 var(--gold, #7aa2ff); }
.notif-item.promo .notif-pin { color: var(--gold-soft, #a5c0ff); }
.notif-item.promo .notif-icon, .notif-item.pinned .notif-icon { background: rgba(255,255,255,.1); }
.notif-dropdown a.notif-item.pinned:hover, .notif-dropdown a.notif-item.promo:hover { filter: brightness(1.15); }
.notif-page .notif-item-promo, .notif-page .notif-item-pinned { border-color: rgba(242,185,92,.5); background: linear-gradient(135deg, rgba(122,162,255,.13), rgba(242,185,92,.06)); }
.notif-page .notif-pin { font-size: .68rem; }
.notif-page .notif-cta { font-size: .78rem; padding: 6px 14px; }
