/* Buggy Smart: save hearts, collection sheet, sign-in modal, toast. */
:root {
  --bs-ink: #2A1433; --bs-muted: #5E5263; --bs-bg: #FBF7F4; --bs-line: #E7DDE4;
  --bs-orange: #FFC9A8; --bs-orange-ink: #4A1F5C; --bs-heart: #4A1F5C;
}
.bs-heart {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  min-width: 44px; min-height: 44px; padding: 0 .6rem; border-radius: 100px;
  border: 1.5px solid var(--bs-line); background: #fff; color: #8A8079;
  font: 600 .85rem 'Inter', system-ui, sans-serif; cursor: pointer; transition: color .15s, border-color .15s, transform .1s;
}
.bs-heart svg path { fill: none; stroke: currentColor; stroke-width: 2; }
.bs-heart.on { color: var(--bs-heart); border-color: #F3C4BF; }
.bs-heart.on svg path { fill: currentColor; }
.bs-heart:active { transform: scale(.94); }
.bs-heart:focus-visible, .bs-btn:focus-visible, .bs-places-link:focus-visible { outline: 3px solid var(--bs-orange-ink); outline-offset: 2px; }
.bs-heart--label { padding: 0 .9rem; color: var(--bs-ink); }
.bs-heart--label.on { color: var(--bs-heart); }

.bs-places-link {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: 0 .85rem;
  border-radius: 100px; background: #fff; color: var(--bs-ink); text-decoration: none;
  font: 700 .85rem 'Inter', system-ui, sans-serif; border: 1.5px solid var(--bs-line); white-space: nowrap;
}
.bs-places-link svg { color: var(--bs-heart); }
.bs-places-link b { background: var(--bs-heart); color: #fff; border-radius: 100px; padding: 0 .45rem; font-size: .75rem; line-height: 1.4rem; }

.bs-toast {
  /* Top of the screen, under the header: the bottom is where the sheet's buttons and fields are. */
  position: fixed; left: 50%; top: calc(var(--bs-toast-top, 64px) + env(safe-area-inset-top, 0px)); transform: translate(-50%, -12px); opacity: 0;
  visibility: hidden; pointer-events: none;
  background: var(--bs-ink); color: #fff; padding: .75rem 1rem; border-radius: 12px; z-index: 10001;
  font: 500 .9rem 'Inter', system-ui, sans-serif; max-width: calc(100vw - 32px); box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transition: transform .2s ease, opacity .2s ease, visibility 0s linear .2s; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
}
.bs-toast.show { transform: translate(-50%, 0); opacity: 1; visibility: visible; pointer-events: auto; transition: transform .2s ease, opacity .2s ease, visibility 0s; }
@media (prefers-reduced-motion: reduce) { .bs-toast { transition: none; } }
.bs-skel { min-height: 200px; background: linear-gradient(90deg, #F6EEF3 0%, #FBF7F4 50%, #F6EEF3 100%); border: 1px solid #E7DDE4; border-radius: 14px; }
.bs-toast-act { background: none; border: 0; color: #FFC9A8; font: 700 .9rem 'Inter', sans-serif; text-decoration: underline; cursor: pointer; padding: .25rem 0; }

.bs-modal-overlay {
  position: fixed; inset: 0; background: rgba(42,20,51,.5); z-index: 10000;
  display: flex; align-items: flex-end; justify-content: center;
}
@media (min-width: 640px) { .bs-modal-overlay { align-items: center; } }
.bs-modal {
  position: relative; background: #fff; color: var(--bs-ink); width: 100%; max-width: 440px;
  border-radius: 18px 18px 0 0; padding: 1.5rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
  max-height: 85vh; overflow-y: auto; font-family: 'Inter', system-ui, sans-serif;
}
@media (min-width: 640px) { .bs-modal { border-radius: 18px; } }
.bs-modal h2 { font: 800 1.3rem/1.2 'Schibsted Grotesk', system-ui, sans-serif; margin: 0 2rem .75rem 0; }
.bs-modal p { margin: 0 0 .9rem; line-height: 1.5; }
.bs-modal-x { position: absolute; top: .5rem; right: .5rem; width: 44px; height: 44px; border: 0; background: none; font-size: 1.6rem; color: var(--bs-muted); cursor: pointer; }
.bs-muted { color: var(--bs-muted); }
.bs-small { font-size: .8rem; color: var(--bs-muted); }
.bs-small a, .bs-link { color: var(--bs-orange-ink); font-weight: 600; }
.bs-link { display: inline-block; margin-top: .9rem; }
.bs-err { color: #B42318; font-weight: 600; }
.bs-btn {
  min-height: 44px; padding: 0 1.1rem; border-radius: 100px; border: 0; background: var(--bs-orange-ink); color: #fff;
  font: 700 .95rem 'Inter', system-ui, sans-serif; cursor: pointer;
}
.bs-btn:disabled { opacity: .6; }
.bs-btn--ghost { background: #fff; color: var(--bs-ink); border: 1.5px solid var(--bs-line); }
.bs-stack { display: grid; gap: .55rem; }
.bs-stack label { font-weight: 600; font-size: .85rem; }
.bs-row { display: flex; gap: .5rem; margin-top: .75rem; }
.bs-row input { flex: 1; min-width: 0; }
.bs-modal input[type=text], .bs-modal input[type=email] {
  min-height: 44px; border: 1.5px solid var(--bs-line); border-radius: 10px; padding: 0 .8rem; font: 16px 'Inter', sans-serif; color: var(--bs-ink);
}
.bs-check { display: flex; align-items: center; gap: .65rem; min-height: 44px; border-bottom: 1px solid var(--bs-line); cursor: pointer; }
.bs-check input { width: 20px; height: 20px; accent-color: var(--bs-orange-ink); }
.bs-check span { flex: 1; font-weight: 600; }
.bs-check small { color: var(--bs-muted); }

/* Facility chips, shared by map, lists and venue pages */
.bs-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.bs-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .6rem; border-radius: 100px; font: 600 .75rem 'Inter', sans-serif; background: #EAF6EE; color: #1E6B3A; }
.bs-chip.no { background: #FBEAE7; color: #9B2C1E; }
.bs-chip.warn { background: #FDF1DC; color: #7A4B00; }

@media (max-width: 400px) { .bs-top .bs-places-link span { display: none; } .bs-top .bs-places-link { padding: 0 .6rem; } }
