/* Custom notification rules. Was #nr-panel-style. Fallback hex colours stay literal.
   Hashed into the shell by scripts/build.mjs (ensure, after views-admin).
   The view appends this link at render so it still follows sheets injected later. */
.nr-panel { display: flex; flex-direction: column; gap: 0.6rem; align-self: stretch; width: 100%; }
.nr-desc { font-size: 0.78rem; color: var(--text-2); margin: 0; }
.nr-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
/* Phone: the rules table is wider than the card (ON column + Edit/Remove
   actions land off-canvas, unreachable). Let it scroll horizontally
   instead of clipping (display:block keeps row layout). */
@media (max-width: 760px) {
  .nr-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
.nr-table td { padding: 0.45rem 0.5rem; border-bottom: 1px solid var(--border-subtle); color: var(--text-1); vertical-align: middle; }
.nr-trigger-pill { display: inline-block; padding: 0.1rem 0.5rem; border-radius: 999px; font-size: 0.7rem; font-weight: 600; background: var(--accent-soft); color: var(--accent-text); }
.nr-off { opacity: 0.5; }
.nr-rowactions { display: flex; gap: 0.35rem; }
.nr-empty { font-size: 0.8rem; color: var(--text-muted); font-style: italic; margin: 0.25rem 0; }
/* Modal form follows the settings-menu control standard: inline
   "Label: [compact control]" rows with the shared form-label /
   form-input / form-select / form-hint classes — no full-width inputs
   (operator feedback 2026-09-01). */
.nr-modal-form { display: flex; flex-direction: column; gap: 0.55rem; min-width: min(420px, 78vw); }
.nr-field { display: flex; flex-direction: column; gap: 0.25rem; }
/* The attribute selector out-specifies .nr-field's display:flex so a
   trigger-hidden field actually disappears (UA [hidden]{display:none} alone
   would lose to .nr-field). */
.nr-field[hidden] { display: none; }
.nr-frow { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.nr-check { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: var(--text-1); }
.nr-modal-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.4rem; }