/* RV Gráfica · Centro global de notificaciones */
.rv-notification-bell {
  width: 39px;
  height: 39px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.38);
  color: #fff;
  border-radius: 11px;
  background: rgba(255,255,255,.08);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.rv-notification-bell:hover,
.rv-notification-bell:focus,
.rv-notification-bell.show {
  color: #fff;
  background: rgba(255,255,255,.17);
  border-color: rgba(255,255,255,.58);
  transform: translateY(-1px);
}
.rv-notification-bell.has-unread i { animation: rvBellSoft 2.8s ease-in-out infinite; }
@keyframes rvBellSoft {
  0%, 78%, 100% { transform: rotate(0); }
  83% { transform: rotate(9deg); }
  88% { transform: rotate(-7deg); }
  93% { transform: rotate(4deg); }
}
.rv-notification-count {
  position: absolute;
  top: -7px;
  right: -8px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 2px solid #0d6efd;
  background: #dc3545;
  color: #fff;
  font-size: .66rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 3px 9px rgba(0,0,0,.2);
}
.rv-notification-menu {
  width: min(430px, calc(100vw - 24px));
  margin-top: 10px !important;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 22px 60px rgba(17, 24, 39, .20), 0 4px 16px rgba(17,24,39,.08);
}
.rv-notification-header {
  padding: 17px 18px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #edf0f4;
}
.rv-notification-eyebrow,
.rv-page-eyebrow {
  margin-bottom: 2px;
  color: #8a94a6;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.rv-notification-header h6 { font-size: 1.02rem; font-weight: 760; color: #172033; }
.rv-unread-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #edf4ff;
  color: #0d6efd;
  font-size: .68rem;
  font-weight: 750;
}
.rv-mark-all-btn {
  color: #536176;
  border: 0;
  background: transparent;
  font-size: .76rem;
  font-weight: 650;
  white-space: nowrap;
}
.rv-mark-all-btn:hover:not(:disabled) { color: #0d6efd; background: #f3f7fd; }
.rv-mark-all-btn:disabled { opacity: .4; }
.rv-notification-tabs {
  display: flex;
  gap: 6px;
  padding: 10px 14px 8px;
  background: #fbfcfe;
}
.rv-notification-tab {
  border: 0;
  border-radius: 9px;
  padding: 6px 10px;
  background: transparent;
  color: #69768a;
  font-size: .78rem;
  font-weight: 700;
}
.rv-notification-tab.active { background: #eaf2ff; color: #0d6efd; }
.rv-notification-list { max-height: 410px; overflow-y: auto; overscroll-behavior: contain; }
.rv-notification-loading,
.rv-notification-empty {
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #8993a5;
  font-size: .83rem;
}
.rv-notification-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 10px;
  gap: 11px;
  align-items: start;
  padding: 13px 16px;
  color: inherit;
  text-decoration: none;
  border-top: 1px solid #f0f2f5;
  background: #fff;
  transition: background .16s ease;
}
.rv-notification-item:hover { background: #f8fafc; color: inherit; }
.rv-notification-item.is-unread { background: #f6f9ff; }
.rv-notification-item.is-unread:hover { background: #eef5ff; }
.rv-notification-item-icon,
.rv-history-icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 1rem;
}
.rv-category-production { color: #155eef; background: #eaf2ff; }
.rv-category-invoicing { color: #087443; background: #e9f8f0; }
.rv-category-finance { color: #8a4b08; background: #fff4e5; }
.rv-category-inventory { color: #6f42c1; background: #f2ecff; }
.rv-category-system { color: #536176; background: #eef1f5; }
.rv-notification-item-title { color: #1d2638; font-size: .84rem; font-weight: 760; line-height: 1.25; }
.rv-notification-item-message {
  margin-top: 3px;
  color: #657187;
  font-size: .77rem;
  line-height: 1.38;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rv-notification-item-meta { margin-top: 6px; color: #9099a9; font-size: .69rem; }
.rv-notification-unread-dot {
  width: 7px;
  height: 7px;
  margin-top: 6px;
  border-radius: 50%;
  background: #0d6efd;
  box-shadow: 0 0 0 4px rgba(13,110,253,.10);
}
.rv-notification-footer { border-top: 1px solid #edf0f4; background: #fbfcfe; }
.rv-notification-view-all {
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #344258;
  text-decoration: none;
  font-size: .78rem;
  font-weight: 720;
}
.rv-notification-view-all:hover { color: #0d6efd; background: #f3f7fd; }

/* Toasts globales */
.rv-toast-stack {
  position: fixed;
  top: 70px;
  right: 16px;
  width: min(390px, calc(100vw - 24px));
  z-index: 1095;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.rv-premium-toast {
  width: 100%;
  pointer-events: auto;
  border: 0;
  border-radius: 15px;
  overflow: hidden;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 45px rgba(15,23,42,.18), 0 3px 12px rgba(15,23,42,.08);
}
.rv-toast-main { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 11px; padding: 13px 13px 12px; }
.rv-toast-icon { width: 38px; height: 38px; border-radius: 11px; display:flex; align-items:center; justify-content:center; font-size:1.02rem; }
.rv-toast-success .rv-toast-icon { background:#e9f8f0; color:#087443; }
.rv-toast-danger .rv-toast-icon { background:#fff0f1; color:#c92a38; }
.rv-toast-warning .rv-toast-icon { background:#fff4e5; color:#8a4b08; }
.rv-toast-info .rv-toast-icon { background:#eaf2ff; color:#155eef; }
.rv-toast-title { color:#182235; font-size:.83rem; font-weight:780; line-height:1.25; }
.rv-toast-message { margin-top:3px; color:#626f84; font-size:.78rem; line-height:1.4; }
.rv-toast-action { display:inline-flex; align-items:center; gap:5px; margin-top:8px; color:#0d6efd; font-size:.74rem; font-weight:750; text-decoration:none; }
.rv-toast-close { width:30px; height:30px; padding:0; border:0; border-radius:9px; background:transparent; color:#98a1af; }
.rv-toast-close:hover { background:#f1f3f6; color:#344258; }
.rv-toast-progress { height:3px; transform-origin:left; animation: rvToastProgress linear forwards; background:#0d6efd; opacity:.78; }
.rv-toast-success .rv-toast-progress { background:#198754; }
.rv-toast-warning .rv-toast-progress { background:#f0ad4e; }
@keyframes rvToastProgress { from { transform:scaleX(1); } to { transform:scaleX(0); } }

/* Historial */
.rv-notifications-page { max-width: 1080px; }
.rv-notifications-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:22px; }
.rv-page-title { margin:0; color:#172033; font-size:2rem; font-weight:800; letter-spacing:-.025em; }
.rv-page-subtitle { color:#758195; font-size:.9rem; }
.rv-page-unread-card { min-width:108px; padding:12px 15px; border:1px solid #e6eaf0; border-radius:14px; background:#fff; text-align:center; box-shadow:0 6px 18px rgba(15,23,42,.04); }
.rv-page-unread-number { display:block; color:#0d6efd; font-size:1.35rem; font-weight:820; line-height:1.1; }
.rv-page-unread-label { color:#8993a5; font-size:.69rem; font-weight:700; }
.rv-notification-filters { display:flex; align-items:flex-end; gap:12px; padding:15px; margin-bottom:16px; border:1px solid #e6eaf0; border-radius:16px; background:#fff; box-shadow:0 4px 14px rgba(15,23,42,.03); }
.rv-filter-group { min-width:190px; }
.rv-filter-group label { display:block; margin-bottom:5px; color:#6f7a8d; font-size:.72rem; font-weight:750; }
.rv-filter-actions { display:flex; gap:8px; }
.rv-notifications-history-card { overflow:hidden; border:1px solid #e4e8ee; border-radius:18px; background:#fff; box-shadow:0 10px 28px rgba(15,23,42,.05); }
.rv-history-item { display:grid; grid-template-columns:44px minmax(0,1fr) 40px; gap:13px; align-items:center; padding:16px 18px; border-top:1px solid #edf0f4; color:inherit; text-decoration:none; transition:background .16s ease; }
.rv-history-item:first-child { border-top:0; }
.rv-history-item:hover { background:#fafbfd; color:inherit; }
.rv-history-item.is-unread { background:#f7faff; }
.rv-history-item.is-unread:hover { background:#f0f6ff; }
.rv-history-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:3px; }
.rv-history-category { color:#7a8598; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.055em; }
.rv-history-date { color:#9aa3b2; font-size:.7rem; white-space:nowrap; }
.rv-history-title { color:#1c2638; font-size:.9rem; font-weight:770; }
.rv-history-message { margin-top:3px; color:#68758a; font-size:.8rem; line-height:1.4; }
.rv-history-state { display:flex; align-items:center; justify-content:flex-end; gap:11px; color:#a4adba; }
.rv-history-unread-dot { width:8px; height:8px; border-radius:50%; background:#0d6efd; box-shadow:0 0 0 4px rgba(13,110,253,.10); }
.rv-history-empty { padding:54px 20px; text-align:center; color:#7a8598; }
.rv-history-empty-icon { width:52px; height:52px; margin:0 auto 12px; display:flex; align-items:center; justify-content:center; border-radius:15px; background:#f1f4f8; color:#8792a5; font-size:1.25rem; }

@media (max-width: 575.98px) {
  .rv-notification-menu {
    position: fixed !important;
    top: 62px !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    transform: none !important;
    margin: 0 !important;
  }
  .rv-notification-list { max-height: min(54vh, 430px); }
  .rv-toast-stack { top: 12px; right:12px; }
  .rv-notifications-page-head { align-items:center; }
  .rv-page-title { font-size:1.65rem; }
  .rv-notification-filters { flex-direction:column; align-items:stretch; }
  .rv-filter-group { min-width:0; width:100%; }
  .rv-filter-actions { width:100%; }
  .rv-filter-actions .btn { flex:1; }
  .rv-history-item { grid-template-columns:40px minmax(0,1fr) 20px; padding:14px 13px; }
  .rv-history-topline { align-items:flex-start; flex-direction:column; gap:2px; }
}


/* Premium 2 · estabilidad de posicionamiento y estados vacíos */
.rv-notification-center {
  position: relative;
}

@media (min-width: 576px) {
  .rv-notification-center > .rv-notification-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto 0 auto auto !important;
    transform: none !important;
    margin: 0 !important;
  }
}

.rv-notification-menu {
  width: min(420px, calc(100vw - 24px));
  max-height: min(620px, calc(100vh - 84px));
}

.rv-notification-menu.show {
  display: flex;
  flex-direction: column;
}

.rv-notification-header,
.rv-notification-tabs,
.rv-notification-footer {
  flex: 0 0 auto;
}

.rv-notification-header > div:first-child {
  min-width: 0;
}

.rv-mark-all-btn {
  flex: 0 0 auto;
}

.rv-unread-pill.is-clear {
  background: #edf8f2;
  color: #16865c;
}

.rv-notification-list {
  min-height: 0;
  flex: 1 1 auto;
  max-height: min(410px, calc(100vh - 235px));
}

.rv-notification-empty {
  min-height: 168px;
  padding: 28px 22px;
  flex-direction: column;
  gap: 10px;
  text-align: center;
  line-height: 1.4;
  overflow: hidden;
}

.rv-notification-empty > i {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  background: #f2f5f9;
  color: #8d98aa;
  font-size: 1.08rem;
  flex: 0 0 auto;
}

.rv-notification-empty-copy {
  min-width: 0;
  max-width: 280px;
}

.rv-notification-empty-title {
  display: block;
  color: #526076;
  font-size: .82rem;
  font-weight: 760;
}

.rv-notification-empty-subtitle {
  display: block;
  margin-top: 3px;
  color: #96a0af;
  font-size: .74rem;
  font-weight: 500;
}

@media (max-width: 575.98px) {
  .rv-notification-center > .rv-notification-menu {
    inset: auto !important;
  }
  .rv-notification-menu {
    max-height: calc(100vh - 78px);
  }
  .rv-notification-list {
    max-height: min(54vh, 430px);
  }
}
