/**
 * The "remember this session" cart button, shared by the schedule grid, the
 * session sidebar and the session teaser card.
 *
 * Contexts restyle it through two hooks rather than by forking the markup:
 * - --rba-bookmark-icon-size for the icon's edge length,
 * - `color`, inherited by the sprite via currentColor.
 *
 * The colour deliberately does NOT change with the state: swapping the outline
 * cart for the filled one is the whole signal, so a context sets one colour and
 * is done.
 */
.rba-sessions-schedule__bookmark {
  --rba-bookmark-icon-size: 20px;

  display: inline-flex;
  align-items: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0 0.25em;
  line-height: 1;
  color: #999;
}

/* A full session offers no cart at all: the button ships hidden from the
   server and js/rba-sessions.bookmarks.js brings it back only while the
   session is already in the cart, so taking it back out stays possible. Needed
   as an explicit rule because the display above would otherwise outrank the
   browser's own [hidden] one. */
.rba-sessions-schedule__bookmark[hidden] {
  display: none;
}

/* The sprite icon sizes off .icon's own custom property, so overriding that one
   value rescales the SVG without touching its stroke. */
.rba-sessions-schedule__bookmark .icon {
  --icon-size: var(--rba-bookmark-icon-size);
}

/* Icon and wording need telling apart once the label sits inside the button.
   A context that wants them tighter or wider overrides this one value. */
.rba-sessions-schedule__bookmark--labelled {
  gap: 0.5em;
}

/* Both carts are in the DOM; only the one matching the state is shown, so the
   JS toggles a class and never touches an icon name or the sprite path. */
.rba-sessions-schedule__bookmark-icon {
  display: inline-flex;
}

.rba-sessions-schedule__bookmark-icon--filled,
.rba-sessions-schedule__bookmark.is-active .rba-sessions-schedule__bookmark-icon--outline {
  display: none;
}

.rba-sessions-schedule__bookmark.is-active .rba-sessions-schedule__bookmark-icon--filled {
  display: inline-flex;
}

/* Same trick for the wording: both words ship, the state picks one. Deliberately
   not a second mechanism - the label and the cart it sits next to must never be
   able to disagree about what the button does. */
.rba-sessions-schedule__bookmark-label--remove,
.rba-sessions-schedule__bookmark.is-active .rba-sessions-schedule__bookmark-label--add {
  display: none;
}

.rba-sessions-schedule__bookmark.is-active .rba-sessions-schedule__bookmark-label--remove {
  display: inline;
}
