/* ══════════════════════════════════════════════════════════════════
   SIJAECH · Buzón de usuario — campana y panel
   ══════════════════════════════════════════════════════════════════ */
.snt-wrap{ position:relative; display:inline-flex; }

.snt-campana{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:9px; cursor:pointer;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.26); color:#fff;
  transition:background .16s ease, border-color .16s ease;
}
.snt-campana:hover{ background:rgba(201,162,39,.9); border-color:#c9a227; color:#16233f; }
.snt-campana:focus-visible{ outline:2px solid #c9a227; outline-offset:2px; }
.snt-badge{
  position:absolute; top:-5px; right:-5px; background:#d13d5c; color:#fff;
  font-size:.58rem; font-weight:800; line-height:1; border-radius:99px;
  padding:3px 5px; min-width:16px; text-align:center; border:2px solid #16233f;
}

/* Panel colgado de la campana */
.snt-panel{
  position:absolute; top:calc(100% + 10px); right:0; width:min(380px, calc(100vw - 24px));
  background:#fff; border:1px solid #e0dbd2; border-radius:13px; overflow:hidden;
  box-shadow:0 22px 50px rgba(12,18,32,.28); z-index:10600;
  animation:sntEntra .16s ease;
}
@keyframes sntEntra{ from{ opacity:0; transform:translateY(-6px);} to{ opacity:1; transform:none; } }
.snt-cab{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 14px; background:#f4f0e4; border-bottom:1px solid #e3dccb;
  font-size:.82rem; font-weight:700; color:#16233f;
}
.snt-cab button{
  background:none; border:0; color:#6b7183; font-size:.7rem; cursor:pointer;
  font-family:inherit; padding:3px 6px; border-radius:6px; white-space:nowrap;
}
.snt-cab button:hover{ background:#fff; color:#16233f; }

.snt-lista{ max-height:min(430px, 60vh); overflow-y:auto; }
.snt-vacio{ margin:0; padding:26px 16px; text-align:center; color:#9b948e; font-size:.82rem; }

.snt-it{
  display:flex; gap:11px; width:100%; text-align:left; align-items:flex-start;
  padding:11px 14px; border:0; border-bottom:1px solid #efece2; background:#fff;
  cursor:pointer; font-family:inherit; transition:background .13s ease;
}
.snt-it:last-child{ border-bottom:0; }
.snt-it:hover{ background:#faf8f3; }
.snt-it.nueva{ background:#fdf9ec; }
.snt-it.nueva:hover{ background:#fbf4dc; }
.snt-ic{
  width:30px; height:30px; border-radius:9px; flex:none;
  display:flex; align-items:center; justify-content:center;
}
.snt-ic svg{ width:16px; height:16px; }
.snt-tx{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.snt-tx b{ font-size:.81rem; font-weight:700; color:#23293a; line-height:1.35; }
.snt-cu{ font-size:.77rem; color:#4b5262; line-height:1.4; }
.snt-me{ font-size:.68rem; color:#9b948e; margin-top:1px; }

@media (max-width:640px){
  .snt-panel{ position:fixed; top:auto; bottom:0; right:0; left:0; width:100%;
    border-radius:14px 14px 0 0; max-height:76vh; }
  .snt-lista{ max-height:calc(76vh - 46px); }
}
@media (prefers-reduced-motion: reduce){ .snt-panel{ animation:none; } }
