/* Barcrawlerz crawl output — front end.
 *
 * LAYOUT ONLY, on purpose. No colours, no fonts, no sizes: these pages are
 * built in Divi and the design belongs there. Everything here is structural
 * (what sits on its own line, what the spacing is) and every rule is a single
 * class so a Divi custom-CSS override wins without !important.
 */

/* Divi forces `list-style-type: decimal; list-style-position: inside` on every
   ol inside .et-l--body. With `inside`, the marker lives in the first line box,
   so a block-level first child (the venue name) shoves it onto a line of its
   own — that is why the number was sitting ABOVE the name.
   We drop the native marker entirely and draw our own with a counter, which is
   also the only way to control its size and alignment independently of the
   name. These three properties need !important because Divi actively sets
   them; nothing else in this file does. */
ol.bcz-crawl-lineup {
  list-style: none !important;
  list-style-position: outside !important;
  padding-left: 0 !important;
  margin: 0 0 1.5em;
  counter-reset: bcz-stop;
}

.bcz-crawl-lineup > li.bcz-crawl-stop {
  counter-increment: bcz-stop;
  position: relative;
  padding-left: 2.1em;
  margin-bottom: .9em;
}

/* Small, dimmed, pinned to the top-left so it reads as an index rather than
   competing with the venue name. */
.bcz-crawl-lineup > li.bcz-crawl-stop::before {
  content: counter(bcz-stop) ".";
  position: absolute;
  left: 0;
  top: .3em;
  width: 1.6em;
  font-size: .62em;
  font-weight: 600;
  line-height: 1;
  opacity: .55;
}

/* The venue name owns its line; the address sits under it. Without this both
   spans are inline and run together ("Sebastian Pintxos Bar818 Juniper St"). */
.bcz-crawl-venue {
  display: block;
}

.bcz-crawl-addr {
  display: block;
  opacity: .75;
  font-size: .85em;
  line-height: 1.35;
  font-weight: 400;
}

/* Check-in block: label, venue, address, each on its own line. */
.bcz-crawl-checkin {
  margin: 0 0 1.25em;
}

.bcz-crawl-checkin-label {
  display: block;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .75em;
  opacity: .7;
}

.bcz-crawl-checkin-name {
  display: block;
}

.bcz-crawl-when {
  margin: 0 0 1em;
}

/* Sits directly under the date and has to be read by someone who has already
   decided the single date shown is wrong for them, so it gets tighter spacing
   than a normal paragraph and no bottom gap that would detach it from the
   date it is qualifying. */
.bcz-crawl-dateinfo {
  margin: -.6em 0 1.25em;
}

.bcz-crawl-dateinfo p {
  margin: 0 0 .4em;
}

.bcz-crawl-dateinfo p:last-child {
  margin-bottom: 0;
}

.bcz-crawl-specials {
  margin: 0 0 1.25em;
}

.bcz-crawl-cta,
.bcz-crawl-map {
  margin: 0 0 1em;
}

/* Deliberately minimal: inline-block so padding applies if Divi's link styles
   give it any, but no colour or border, so a Divi Button next to it doesn't
   end up competing with a half-styled one. */
.bcz-crawl-btn {
  display: inline-block;
}

/* Map image. Full width of its container and nothing else: the map is drawn
   at whatever aspect the designer chose and cropping it would lose streets. */
.bcz-crawl-map-img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Stacked dates. A list rather than separated text, so the gap between nights
   is spacing you can change instead of a punctuation character you cannot. */
ul.bcz-crawl-dates {
  list-style: none !important;
  list-style-position: outside !important;
  padding-left: 0 !important;
  margin: 0 0 1em;
}

.bcz-crawl-dates > li.bcz-crawl-date {
  display: block;
  margin: 0 0 .25em;
}

.bcz-crawl-dates > li.bcz-crawl-date:last-child { margin-bottom: 0; }
