/* ==========================================================================
   NOTAM card — touch targets for select / deselect

   A collapsed card is one big tap target (the whole card toggles it). An EXPANDED card
   is not: measured at a 430px viewport with the live feed, only ~21% of it reached the
   card's click handler. Two blocks swallow taps on purpose — the VALID/SCHED block
   flips Zulu/Local, and the raw-text box scrolls and has to stay selectable/copyable
   (a click handler there would collapse the card on the first click of a double-click
   word select). That left the ID/badge strip as the only way to deselect.

   So the dead zone is not removed; the targets around it are made generous instead:
   the header strip grows to the 44px touch minimum (Apple HIG; see
   16-notam-filter-mobile.css for the same reasoning), and a full-width close bar sits
   under the text, where a thumb lands after reading. Both bubble to the card's toggle.

   BOTH THEMES LIVE IN THIS FILE, adjacent, on purpose — the same guardrail as
   16-notam-filter-mobile.css: colour that is only right in one theme has shipped
   invisible-in-the-other more than once.
   ========================================================================== */

.notam-card-item.expanded .notam-card-header {
  min-height: 44px;
  touch-action: manipulation;
}

.notam-card-close {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 44px;
  margin-top: 0.5rem;
  border-radius: 6px;
  border: 1px dashed var(--glass-border);
  color: var(--text-muted);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.notam-card-close svg {
  width: 16px;
  height: 16px;
}
.notam-card-close:hover {
  color: var(--color-accent);
  border-color: var(--color-accent);
  background: var(--color-accent-dim);
}

/* Light theme: the dark-theme border is white-on-white there, so it gets a real ink colour. */
body.light-theme .notam-card-close {
  border-color: rgba(17, 24, 39, 0.25);
  color: #4b5563;
}
body.light-theme .notam-card-close:hover {
  color: #b45309;
  border-color: #b45309;
  background: rgba(245, 158, 11, 0.12);
}
