/* SaloCart V5.2.41 – Professional role-aware web push experience */
.push-status-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  padding: 1.1rem;
  border: 1px solid color-mix(in srgb, var(--sc-green, #0f8318) 25%, transparent);
  border-radius: 1.15rem;
  background: linear-gradient(135deg, color-mix(in srgb, var(--sc-green, #0f8318) 11%, var(--surface, #fff)), var(--surface, #fff));
}
.push-status-card > i { align-self: start; display:grid; place-items:center; width:2.65rem; height:2.65rem; border-radius:.9rem; color:#fff; background:#0f8318; font-size:1.25rem; box-shadow:0 .55rem 1.15rem rgba(15,131,24,.22); }
.push-status-card h3 { margin:0 0 .3rem; font-size:1rem; }
.push-status-card p { margin:0; max-width:62ch; color:var(--muted, #64748b); line-height:1.55; }
.push-awareness-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.55rem; margin:.9rem 0 .8rem; }
.push-awareness-grid > span { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:.45rem; align-items:start; padding:.62rem; border-radius:.75rem; background:color-mix(in srgb, #fff 80%, transparent); border:1px solid color-mix(in srgb, #0f8318 15%, transparent); }
.push-awareness-grid i { grid-row:span 2; color:#0f8318; font-size:1rem; }
.push-awareness-grid b { min-width:0; font-size:.75rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.push-awareness-grid small { min-width:0; color:var(--muted, #64748b); font-size:.68rem; line-height:1.3; }
.push-status-pill { display:inline-flex; align-items:center; gap:.35rem; width:max-content; max-width:100%; margin-top:.15rem; padding:.35rem .6rem; border-radius:999px; background:rgba(15,131,24,.1); color:#0f8318; font-size:.76rem; font-weight:800; }
.push-actions { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:.8rem; }

.notification-card { position:relative; width:100%; min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:start; gap:.72rem; text-align:left; }
button.notification-card { border:0; cursor:pointer; }
.notification-card__icon { display:grid; place-items:center; flex:0 0 auto; width:2.45rem; height:2.45rem; border-radius:.85rem; font-size:1.05rem; background:#0f8318; color:#fff; }
.notification-card__body { min-width:0; }
.notification-card__eyebrow { display:block; margin:0 0 .18rem; color:#0f8318; font-size:.68rem; font-weight:900; letter-spacing:.07em; text-transform:uppercase; }
.notification-card h3 { margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.95rem; }
.notification-card p { margin:.22rem 0 .38rem; color:var(--muted, #64748b); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.42; }
.notification-card small { display:block; }
.notification-card .notification-card-arrow { align-self:center; margin-left:.25rem; color:var(--muted, #64748b); }
.notification-card.is-unread { border-left:3px solid #0f8318; box-shadow:0 .6rem 1.4rem rgba(15,131,24,.08); }
.notification-card.is-read { opacity:.82; }
.notification-card--chat .notification-card__icon { background:#1769aa; }.notification-card--chat .notification-card__eyebrow{color:#1769aa;}
.notification-card--fulfillment .notification-card__icon { background:#6e4caf; }.notification-card--fulfillment .notification-card__eyebrow{color:#6e4caf;}
.notification-card--settlement .notification-card__icon { background:#145f7a; }.notification-card--settlement .notification-card__eyebrow{color:#145f7a;}
.notification-card--rewards .notification-card__icon { background:#a36509; }.notification-card--rewards .notification-card__eyebrow{color:#a36509;}
.notification-card--account .notification-card__icon { background:#556274; }.notification-card--account .notification-card__eyebrow{color:#556274;}
.notification-card--admin .notification-card__icon { background:#d56b10; }.notification-card--admin .notification-card__eyebrow{color:#d56b10;}

[data-theme="dark"] .push-status-card { background:linear-gradient(135deg, rgba(15,131,24,.17), rgba(15,23,42,.88)); border-color:rgba(134,239,172,.2); }
[data-theme="dark"] .push-awareness-grid > span { background:rgba(255,255,255,.045); border-color:rgba(255,255,255,.09); }
[data-theme="dark"] .notification-card.is-unread { box-shadow:0 .7rem 1.6rem rgba(0,0,0,.2); }

@media (max-width: 760px) { .push-awareness-grid { grid-template-columns:1fr; } .push-awareness-grid > span { grid-template-columns:auto minmax(0,1fr); } .push-awareness-grid small { white-space:normal; } }
@media (max-width: 440px) { .push-status-card { gap:.75rem; padding:.9rem; } .push-status-card > i { width:2.3rem; height:2.3rem; border-radius:.75rem; font-size:1rem; } .notification-card { gap:.58rem; padding:.78rem; } .notification-card__icon { width:2.2rem; height:2.2rem; border-radius:.72rem; font-size:.95rem; } .notification-card h3 { font-size:.9rem; } .notification-card p { -webkit-line-clamp:3; font-size:.82rem; } }
@media (prefers-reduced-motion: reduce) { .notification-card, .push-status-card { transition:none !important; } }
