/* supplement.css — DEMA a.s. — hook для правок вёрстки в Фазе 4 */

/* ---------------------------------------------------------------
   1. Header navigation (r-nav.php)
   The legacy rule `li {list-style: outside url(/img/odr.png)}` drew a
   green square next to every list item, nav included, and `outside`
   markers overlapped the neighbouring link. Markers are reset here;
   nav links carry inline colours, so hover states need !important.
   --------------------------------------------------------------- */
#romli-nav ul,
#romli-nav li {
  list-style: none;
  margin: 0;
  text-align: left;
}
#romli-nav a {
  transition: color .15s ease, background-color .15s ease;
}
#romli-nav a:hover,
#romli-nav a:focus-visible {
  text-decoration: none;
}
#romli-nav ul li:not(:last-child) a {
  position: relative;
}
#romli-nav ul li:not(:last-child) a:hover,
#romli-nav ul li:not(:last-child) a:focus-visible {
  color: #850013 !important;
}
#romli-nav ul li:not(:last-child) a::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 16px;
  height: 2px;
  background: #850013;
  transform: scaleX(0);
  transition: transform .18s ease;
}
#romli-nav ul li:not(:last-child) a:hover::after,
#romli-nav ul li:not(:last-child) a:focus-visible::after {
  transform: scaleX(1);
}
#romli-nav ul li:last-child a:hover,
#romli-nav ul li:last-child a:focus-visible {
  background: #6b000f !important;
}

@media (max-width: 760px) {
  #romli-nav > div {
    height: auto !important;
    padding: 10px 20px 12px !important;
    justify-content: center !important;
    gap: 6px;
  }
  #romli-nav ul {
    justify-content: center;
  }
  #romli-nav ul li a {
    line-height: 2.4 !important;
  }
  #romli-nav ul li:not(:last-child) a::after {
    bottom: 2px;
  }
}

/* ---------------------------------------------------------------
   2. Legacy absolute-positioned coordinate layout → document flow.
   Nav/logo/footer used to be drawn by document.write; now they are
   static r-nav.php / r-template-footer.php includes, so the content
   <span>s must flow. The old canvas placed the title at left:24px and
   the 600px text column at left:216px, which left the right half of a
   modern viewport empty — both spans are centred in one column now.
   --------------------------------------------------------------- */
#romli-nav ~ span[style*="absolute"] {
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: block;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
  font-size: 16px;
  line-height: 1.62;
  color: #1c1c1c;
}
#romli-nav ~ span table {
  max-width: 100%;
}

/* page title block: 192px table = green rule image + <h1> */
#romli-nav ~ span table[width="192px"] {
  width: 100% !important;
  margin: 34px 0 2px;
}
#romli-nav ~ span table[width="192px"] td {
  width: auto !important;
}
#romli-nav ~ span table[width="192px"] td:first-child {
  display: none;
}
/* most pages title the block with <h2>, a few with <h1> */
#romli-nav ~ span table[width="192px"] h1,
#romli-nav ~ span table[width="192px"] h2 {
  margin: 0;
  font-size: 27px;
  line-height: 1.2;
  border-left: 4px solid #850013;
  padding-left: 16px;
}
/* `<p><h1>…</h1></p>` parses into stray empty paragraphs */
#romli-nav ~ span p:empty {
  display: none;
}

/* text column: fixed 600px shell and its spacer rows */
#romli-nav ~ span > table[width="600px"] {
  width: 100% !important;
}
#romli-nav ~ span > table[width="600px"] > tbody > tr > td {
  width: auto !important;
}
#romli-nav ~ span > table[width="600px"] > tbody > tr[height="192px"] {
  height: auto !important;
}
#romli-nav ~ span > table[width="600px"] > tbody > tr[height="96px"],
#romli-nav ~ span > table[width="600px"] > tbody > tr[height="24px"],
#romli-nav ~ span > table[width="600px"] > tbody > tr > td[width="24px"] {
  display: none;
}

/* ---------------------------------------------------------------
   3. Legacy content typography
   --------------------------------------------------------------- */
#romli-nav ~ span p {
  margin: 0 0 1.05em;
}
#romli-nav ~ span ul,
#romli-nav ~ span ol {
  margin: .8em 0 1em 1.4em;
  padding: 0;
}
#romli-nav ~ span li {
  margin-bottom: .35em;
  list-style: square;
}
#romli-nav ~ span li::marker {
  color: #850013;
}
/* style.css greys out :visited, which reads as a dead link */
#romli-nav ~ span a:link,
#romli-nav ~ span a:visited {
  color: #123a6b;
}
#romli-nav ~ span a:hover,
#romli-nav ~ span a:active {
  color: #850013;
  text-decoration: underline;
}
/* news items open with a 24px series icon (rU/rE/rI/rS.png) */
#romli-nav ~ span p > a > img[src^="/img/r"] {
  vertical-align: -7px;
  margin-right: 8px;
}
#romli-nav ~ span p:has(> a > img[src^="/img/r"]) {
  margin: 0 0 1.3em;
  padding: 0 0 1.3em;
  border-bottom: 1px solid #e3e0e0;
}

/* ---------------------------------------------------------------
   4. Promo blocks (showLinks / showSitewide in romlifile.php)
   Narrow grid cells inherit the justified body text, which tears
   words apart at ~200px column width.
   --------------------------------------------------------------- */
.romlidata p,
.romlifooter p {
  text-align: left;
  font-size: 13px;
  line-height: 1.55;
  margin: 8px 0 0;
}
.romlidata img,
.romlifooter img {
  border-radius: 2px;
}

/* ---------------------------------------------------------------
   5. Article template (r-template_article.php) list markers
   --------------------------------------------------------------- */
.dsoy69 ul {
  list-style: disc;
}
.dsoy69 ol {
  list-style: decimal;
}
.dsoy69 li::marker {
  color: #850013;
}
