/* css/share-notifier.css — Shared-URL band notifier panel (Phase 11). Imported into the components layer. */

.share-notifier-panel {
  display: block;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid rgba(240, 236, 228, 0.06);
}

.share-notifier-panel__heading {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--space-2);
}

.share-notifier-panel__row {
  display: flex;
  gap: var(--space-3);
  align-items: center;
}

.share-notifier-panel__picker {
  min-height: 44px;
  flex: 1;
  max-width: 100%;
  /* font-size, border, focus ring inherit from global `input, select` rule */
}

.share-notifier-panel__hint {
  font-size: 0.8rem;
  color: var(--text-muted);
  margin-top: var(--space-2);
  line-height: 1.4;
}

.share-notifier-panel__message {
  font-size: 0.8rem;
  color: var(--color-error);
  margin-top: var(--space-2);
  padding: var(--space-2);
  background: rgba(239, 91, 91, 0.06);
  border-left: 3px solid var(--color-error);
  border-radius: var(--radius-xs);
}

.share-notifier-panel__message--persistent {
  /* No auto-dismiss; cleared only on next successful pick or — None — */
}

/* Italic on the two non-band specials (— None — and All slots). Graceful degrade on mobile Safari where option-level styling is ignored. */
.share-notifier-panel__picker option[value=""]:not([disabled]),
.share-notifier-panel__picker option[value="__all__"] {
  font-style: italic;
}

/* NOTE: .timetable-row--mine* (Phase 11 row highlight that historically sat in this section) lives in css/timetable-table.css per R-PATTERNS-CW2-2 BEM-purity routing. */