/* Additions on top of the shared Premier Co-Living stylesheet (/_astro/coliving.css) */

/* Opening quote mark on testimonial cards */
.quote blockquote::before {
  content: "\201C";
  display: block;
  font-size: 3.5rem;
  line-height: .6;
  margin-bottom: .9rem;
  color: var(--color-gold);
}

/* Photo lightbox on the Properties page */
.lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(0, 0, 0, .94); display: none; align-items: center; justify-content: center; padding: 24px; }
.lightbox.is-open { display: flex; }
.lightbox img { max-height: 86vh; width: auto; border-radius: 1.25rem; box-shadow: inset 0 0 0 1px rgba(212, 175, 99, .22); }
.lightbox button {
  position: absolute; width: 48px; height: 48px; display: grid; place-items: center;
  background: #000; color: var(--color-ink); border: 1px solid var(--color-gold);
  box-shadow: inset 0 0 0 3px #000, inset 0 0 0 4px #d4af638c;
  font-size: 1.4rem; cursor: pointer;
}
.lightbox button:hover { color: var(--color-gold-2); }
.lightbox .lb-close { top: 18px; right: 18px; }
.lightbox .lb-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox .lb-next { right: 18px; top: 50%; transform: translateY(-50%); }

/* Keep the header on one line now it has seven links */
.site-header a { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1279px) {
  .site-header .brand-word { font-size: 1.5rem; }
  .site-header nav[aria-label="Primary"] > a:not(.btn) { padding-inline: .5rem; }
  .site-header nav[aria-label="Primary"] > .btn { margin-left: .25rem; }
}

/* Property map (Leaflet), styled to match the site */
.property-map { height: 480px; background: #0e0e10; }
.property-map .leaflet-popup-content-wrapper, .property-map .leaflet-popup-tip { background: #0e0e10; color: var(--color-ink); border: 1px solid #d4af6355; }
.property-map .leaflet-popup-content { font-family: var(--font-body); }
.property-map .leaflet-popup-content strong { font-family: var(--font-display); color: var(--color-gold); }
.property-map .leaflet-control-attribution { background: rgba(0,0,0,.6); color: #999; }
.property-map .leaflet-control-attribution a { color: #bbb; }
@media (max-width: 640px) { .property-map { height: 380px; } }

.pl-pin { background: none; border: 0; filter: drop-shadow(0 2px 3px rgba(0,0,0,.6)); }

/* Darken the OpenStreetMap tiles to match the black-and-gold site */
.property-map .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(.85) contrast(.9) saturate(.35); }