/*
 * Style sheet for the CSS2 specification
 * $Id: default.css,v 1.20 1998/01/28 20:54:35 bbos Exp $
 *c80a13 is the color of the bold red text usually
 */

B { color: #d20000; }

.fb-comments { width:100% }

td > ol {
  margin: 0;
  padding-left: 22px;
}

td > ol > li {
  font-size: 14px;
  font-weight: normal;
  line-height: 1.5;
}

/* Keep <a> inline (do NOT set block or line-height here) */
td a[href^="/lyrics/new/track.asp"] {
  display: inline;
}

.lyrics-link {
  color: #d20000;
  text-decoration: none;
  transition: opacity .18s ease;
  opacity: .65;
}

.lyrics-link:hover {
  opacity: .45;
}
.jfh-tracklist li:has(.lyrics-link:hover) .track-title {
  color: #d20000;
}
.track-title {
  transition: color .15s ease;
}
.no-lyrics {
  color: #ededed;
  text-decoration: line-through;
}
/* Row-height control lives on the label itself */
.lyrics-link,
.no-lyrics {
  display: inline-block;
  width: 40px;
  text-align: right;
  font-size: 8px;
  font-weight: bold;
  letter-spacing: 0.5px;
  line-height: 21px;
  height: 21px;
  vertical-align: top;
}


/* After lyrics mobile fix */
/* ==============================
   JFH Tracklist + Lyrics Links
   Keeps LYRICS aligned per track
   Adds a consistent max-width so LYRICS isn't pushed too far right
   Restores numbering even though LI uses flex
   ============================== */

/* Tracklist layout */
ol.jfh-tracklist {
  margin: 0;
  width: 100%;
  max-width: 550px;     /* consistent cap (adjust if you want) */

  /* IMPORTANT: flex on <li> kills native OL numbering, so we use counters */
  list-style: none;
  padding-left: 0;
  margin-left: 0;
  counter-reset: track;
}

ol.jfh-tracklist > li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;

  counter-increment: track;
}

/* The number */
ol.jfh-tracklist > li::before {
  content: counter(track) ". ";
  display: inline-block;
  width: 32px;          /* space reserved for 1. ... 11. etc */
  text-align: right;
  margin-right: 10px;
  flex: 0 0 auto;
}

/* Title + lyrics */
ol.jfh-tracklist .track-title {
  flex: 1 1 auto;
  min-width: 0;         /* allows wrapping */
}

ol.jfh-tracklist .track-lyrics {
  flex: 0 0 auto;
  white-space: nowrap;
}

img.jfh-album-cover {
  outline: 1px solid rgba(0,0,0,0.07);
  transition: transform .18s ease, box-shadow .18s ease;
}

a:hover img.jfh-album-cover {
  transform: scale(1.04);
  box-shadow: 0 3px 10px rgba(0,0,0,0.14);
  cursor: pointer;
}
.w3-cd-cover {
  text-align: center;
}

/* Optional: tighten on small screens without changing structure */
@media (max-width: 520px) {
  ol.jfh-tracklist > li {
    gap: 10px;
  }

  ol.jfh-tracklist .track-lyrics {
    font-size: 11px;
  }
}