/* Notices + dashboards (Sajjad 01.11.2026): Lumen cards, soft tinted icon chips instead of side bars, CSS-only charts. */
.ntc-filters { display: grid; gap: var(--space-2); margin-bottom: var(--space-4); }
.ntc-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.ntc-chip { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 32px; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text-secondary); font: inherit; font-size: var(--font-size-sm); cursor: pointer; }
.ntc-chip:hover { border-color: var(--color-primary); }
.ntc-chip.on { background: var(--color-primary-subtle-2); border-color: var(--color-primary); color: var(--color-text); font-weight: 700; }
.ntc-chip-n { font-variant-numeric: tabular-nums; color: var(--color-text-muted); }
.ntc-group { margin-bottom: var(--space-5); }
.ntc-group-title { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-2); font-size: var(--font-size-lg); font-weight: 700; }
.ntc-group-title.bad .ic { color: var(--color-danger-text); } .ntc-group-title.warn .ic { color: var(--color-warning-text); } .ntc-group-title.info .ic { color: var(--color-info-text); }
.ntc-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--d-radius-card); box-shadow: var(--shadow-1); overflow: hidden; }
.ntc-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-2) var(--space-3); align-items: center; padding: var(--space-3) var(--space-4); }
.ntc-item + .ntc-item { border-top: 1px solid var(--color-divider); }
.ntc-ic { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--color-surface-secondary); color: var(--color-text-secondary); }
.ntc-ic.bad { background: var(--color-danger-subtle); color: var(--color-danger-text); }
.ntc-ic.warn { background: var(--color-warning-subtle); color: var(--color-warning-text); }
.ntc-ic.info { background: var(--color-info-subtle); color: var(--color-info-text); }
.ntc-title { font-weight: 700; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
.ntc-amount { font-weight: 600; color: var(--color-text-secondary); font-variant-numeric: tabular-nums; font-size: var(--font-size-sm); }
.ntc-text { margin-top: 2px; }
.ntc-actions { display: flex; align-items: center; gap: var(--space-1); }
.ntc-toggle .ic { transition: transform .15s; } .ntc-toggle.open .ic { transform: rotate(180deg); }
.ntc-rows { grid-column: 2 / -1; padding-top: var(--space-1); }
.ntc-rowlist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 2px var(--space-4); max-height: 300px; overflow: auto; }
.ntc-rowlist li { display: flex; justify-content: space-between; gap: var(--space-2); min-width: 0; padding: 3px 0; }
.ntc-rowlist a, .ntc-rowlist li > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ntc-skel { height: 56px; margin-bottom: var(--space-2); }
.ntc-empty { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-4); background: var(--color-success-subtle); border-radius: var(--d-radius-card); color: var(--color-success-text); }
.ntc-empty > div { color: var(--color-text); }
.ntc-foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); }
.ntc-checked { margin-left: auto; }
.ntc-home .card-body { padding: 0; }
.ntc-home .ntc-empty { margin: var(--space-3) var(--space-4); }
.ntc-home .card-head { border-bottom: 1px solid var(--color-divider); }
.ntc-all { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-top: 1px solid var(--color-divider); font-weight: 600; }
.ntc-all[hidden] { display: none; }
.ntc-home[hidden] { display: none; }
.muted-item .ntc-title { font-weight: 600; color: var(--color-text-secondary); }
@media (max-width: 640px) {
  .ntc-item { grid-template-columns: auto minmax(0, 1fr); padding: var(--space-3); }
  .ntc-actions { grid-column: 1 / -1; flex-wrap: wrap; justify-content: flex-end; }
  .ntc-rows { grid-column: 1 / -1; }
  .ntc-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .ntc-chips::-webkit-scrollbar { display: none; }
  .ntc-chip { flex: none; }
  .ntc-checked { margin-left: 0; width: 100%; }
  .ntc-home .card-head { flex-wrap: wrap; }
}

