/* lc-event-favorites.css — Save pill/drawer + heart buttons + reminder form.
   Neutral white, green accent, sharp corners — matches the /events/ skin. */
:root{--lcf-accent:#2f6f57;--lcf-ink:#1a1a1a;--lcf-muted:#6b6b6b;--lcf-line:#e5e5e5;
  --lcf-chrome:"Montserrat",-apple-system,sans-serif;--lcf-serif:"PT Serif",Georgia,serif;}

/* ---- heart save button (overlaid on cards; inline on single) ---- */
.lc-fav{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;
  background:rgba(255,255,255,.92);border:1px solid var(--lcf-line);border-radius:0;color:var(--lcf-ink);
  cursor:pointer;line-height:0;transition:background .15s,color .15s;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.lc-fav svg{display:block}
.lc-fav svg path{fill:none;stroke:currentColor;stroke-width:1.8px}
.lc-fav:hover{background:#fff;color:var(--lcf-accent)}
.lc-fav.is-on{background:var(--lcf-accent);color:#fff;border-color:var(--lcf-accent)}
.lc-fav.is-on svg path{fill:currentColor;stroke:currentColor}
/* on a card photo, sit top-right (date badge is top-left) */
.lc-photo .lc-fav{position:absolute;top:8px;right:8px;z-index:3}
/* on the single-event hero, top-right above the gradient */
.lc-es__hero .lc-fav{position:absolute;top:16px;right:16px;z-index:2}

/* ---- floating "Saved (N)" pill ---- */
.lc-favpill{position:fixed;right:20px;bottom:22px;z-index:1200;display:inline-flex;align-items:center;gap:8px;
  padding:11px 18px;background:var(--lcf-ink);color:#fff;border:0;border-radius:0;cursor:pointer;
  font-family:var(--lcf-chrome);text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,.22)}
.lc-favpill svg path{fill:#fff}
.lc-favpill__n{background:var(--lcf-accent);color:#fff;border-radius:0;padding:1px 7px;font-size:11px}
.lc-favpill.is-hidden{display:none}
@media(max-width:959px){.lc-favpill{bottom:76px;right:14px}}
/* Withdrawn while the reader scrolls down. See the note in lc-event-favorites.js for why
   an offset cannot solve this: a fixed pill always covers something, and at 414 what it
   covers is the right two-thirds of a line of body text.
   Translated rather than hidden, so it slides out and back instead of blinking; the
   transform keeps it off the paint path while away. */
.lc-favpill{transition:transform .22s ease,opacity .22s ease}
body.lc-favpill-away .lc-favpill{transform:translateY(140%);opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){
  .lc-favpill{transition:none}
  body.lc-favpill-away .lc-favpill{transform:none;opacity:0}
}

/* ---- drawer ---- */
.lc-favdrawer__backdrop{position:fixed;inset:0;background:rgba(15,15,15,.45);opacity:0;visibility:hidden;
  transition:opacity .2s;z-index:1300}
.lc-favdrawer{position:fixed;top:0;right:0;height:100%;width:360px;max-width:88vw;background:#fff;z-index:1310;
  transform:translateX(100%);transition:transform .24s ease;display:flex;flex-direction:column;
  box-shadow:-8px 0 30px rgba(0,0,0,.18);font-family:var(--lcf-serif);color:var(--lcf-ink)}
body.lc-favdrawer-open .lc-favdrawer{transform:translateX(0)}
body.lc-favdrawer-open .lc-favdrawer__backdrop{opacity:1;visibility:visible}
.lc-favdrawer__head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;
  border-bottom:1px solid var(--lcf-line);font-family:var(--lcf-chrome);text-transform:uppercase;
  letter-spacing:1.5px;font-size:12px}
.lc-favdrawer__close{background:none;border:0;font-size:26px;line-height:1;cursor:pointer;color:var(--lcf-muted)}
.lc-favdrawer__list{padding:12px 14px;overflow:auto;flex:1}
.lc-favdrawer__empty{color:var(--lcf-muted);font-size:14px;line-height:1.6;padding:20px 6px}
.lc-favrow{display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center;padding:10px 6px;
  border-bottom:1px solid var(--lcf-line)}
.lc-favrow__media{display:block;width:60px;height:52px;overflow:hidden;background:#fafafa}
.lc-favrow__media img{width:100%;height:100%;object-fit:cover;display:block}
.lc-favrow__noimg{display:block;width:100%;height:100%;background:#fafafa}
.lc-favrow__title{font-family:var(--lcf-serif);font-size:15px;color:var(--lcf-ink);text-decoration:none;line-height:1.25}
.lc-favrow__title:hover{color:var(--lcf-accent)}
.lc-favrow__meta{font-family:var(--lcf-chrome);text-transform:uppercase;letter-spacing:.5px;font-size:10px;
  color:var(--lcf-muted);margin-top:3px}
.lc-favrow__rm{background:none;border:0;font-size:22px;line-height:1;cursor:pointer;color:var(--lcf-muted)}
.lc-favrow__rm:hover{color:var(--lcf-ink)}

/* ---- reminder form (single event page) ---- */
.lc-evt-remind{margin:22px 0 4px;padding:16px;border:1px solid var(--lcf-line);background:#fafafa}
.lc-remind__lead{font-family:var(--lcf-serif);font-size:14px;color:var(--lcf-muted);margin:0 0 10px}
.lc-remind__open{font-family:var(--lcf-chrome);text-transform:uppercase;letter-spacing:1.5px;font-size:11px;
  font-weight:600;padding:11px 18px;background:#fff;border:1px solid var(--lcf-line);color:var(--lcf-ink);
  border-radius:0;cursor:pointer}
.lc-remind__open:hover{border-color:var(--lcf-muted)}
.lc-remind__form{display:flex;flex-wrap:wrap;gap:8px}
.lc-remind__form input[type=email]{flex:1;min-width:180px;padding:11px;border:1px solid var(--lcf-line);
  border-radius:0;font-family:var(--lcf-serif);font-size:15px}
.lc-remind__form button{font-family:var(--lcf-chrome);text-transform:uppercase;letter-spacing:1.5px;font-size:11px;
  font-weight:600;padding:11px 18px;background:var(--lcf-accent);border:1px solid var(--lcf-accent);color:#fff;
  border-radius:0;cursor:pointer}
.lc-remind__form button:disabled{opacity:.6;cursor:default}
.lc-remind__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.lc-remind__msg{font-family:var(--lcf-serif);font-size:14px;margin:8px 0 0}
.lc-remind__msg.is-ok{color:var(--lcf-accent)}
.lc-remind__msg.is-err{color:#8a1c1c}
