/*
 * Shared stylesheet for the fmnaInstallCenter release-notes pages.
 * Replaces the six per-page RocketCake stylesheets. Design tokens (fonts,
 * sizes, colours, image shadow) are carried over verbatim from the original
 * generated CSS so the rendered result is visually unchanged.
 */

:root {
  --font-stack: Segoe, 'Segoe UI', 'Helvetica Neue', sans-serif;
  --color-text: #6A6A6A;
  --color-strong: #000000;
  --color-accent: #5D5D9E;
  --img-shadow: 5px 5px 4px 0px rgba(0, 0, 0, 0.588235);
}

a { color: var(--color-accent); }
a:visited { color: var(--color-accent); }
a:active { color: #5C615E; }
a:hover { color: #B2B3B4; }

body {
  background-color: #FFFFFF;
  padding: 0;
  margin: 0;
}

/* Outer text block — was RocketCake's .textstyle1 + container padding. */
.notes {
  text-align: left;
  margin: 10px;
  font-family: var(--font-stack);
  font-size: 12pt;
  color: var(--color-text);
}

/* "General Information:" page header (was .textstyle2 @ 18pt bold). */
.notes-title {
  font-size: 18pt;
  font-weight: bold;
  color: var(--color-text);
  margin: 0;
}

/* Intro sentence + general-info list text (was .textstyle4 @ 12pt). */
.notes p,
.notes li {
  font-size: 12pt;
  color: var(--color-text);
}

.notes ul {
  margin: 0;
}

/* Bold inline labels such as "Database Revision:" (was .textstyle5). */
.label {
  font-weight: bold;
}

/* The italic "DENT" in "hyperDENT" (was .textstyle6). */
.label em {
  font-style: italic;
}

/* "Revision Notes:" sub-header (was .textstyle7 @ 16pt bold). */
.notes-subhead {
  font-size: 16pt;
  font-weight: bold;
  color: var(--color-text);
  margin: 1em 0 0;
}

/* Revision index list (was .ulstyle2 @ 14pt, accent links via .textstyle8). */
.revision-index {
  font-size: 14pt;
  color: var(--color-accent);
}

.revision-index a {
  font-size: 14pt;
}

/* Per-revision heading, e.g. "Revision G: 09/08/2025" (was .textstyle5 bold). */
.revision-heading {
  font-size: 12pt;
  font-weight: bold;
  color: var(--color-text);
  margin: 1.5em 0 0.5em;
}

/* Screenshots embedded in revision notes (was per-image container + shadow). */
.note-fig {
  margin: 20px;
}

.note-fig img {
  display: inline-block;
  width: 100%;
  height: auto;
  max-width: 1000px;
  box-shadow: var(--img-shadow);
}

/* Wide screenshots that occupied ~half the column in the original. */
.note-fig--half {
  width: 50%;
  min-width: 500px;
  max-width: 1000px;
}

/* Narrower inline screenshots (Roland DGA template tables) with left offset. */
.note-fig--inline {
  width: 28%;
  min-width: 500px;
  max-width: 1000px;
  margin-left: 50px;
}