/* ============================================================
   «Төрийн мэдээлэл» — нийтийн портал (М5)

   Тем нь MNLES-ийнх. Токен бүр fork-ийн эх кодоос ХЭМЖИГДСЭН, зохиогдоогүй:

     --tm-brand  #0d2b4e   leos-mn styles.scss:
                           :root:root { --eui-base-color-primary-100 }
                           (EUI-ийн анхдагч #004494-ийг оператор дарж бичсэн,
                           ингэснээр Keycloak-ийн нэвтрэх хуудас ба апп нэг
                           өнгөтэй болсон)
     --tm-gold   #ffd900   hero-ийн доод зурвас, гарын фокусын хүрээ
     hero        112deg #061a31 → #0d2b4e → #17497c + баруун дээд ХӨХ цацраг
                           leos-mn landing-page.component.scss

   MNLES-ийн код дотор бичигдсэн дүрэм, дагана: АЛТ ХӨХ ДЭЭР ХОЛЬВОЛ
   ХҮРЭН-НОГООН БОЛНО. Тэр учраас цацраг нь хөх (анхны хувилбарт алт байсан
   бөгөөд өнгөний менежментийн алдаа мэт харагдаж байжээ). Алт зөвхөн ДАНГААРАА
   ЗОГСОХ газартаа: зурвас, картын толгойн цэг, фокус.

   Мэдээллийн бүтэц нь EUR-Lex-ийнх: таб зурвас, бичвэрийн дээрх таних блок,
   хувилбар × формат хүснэгт, «байнгын хаяг» ба «энэ хувилбарын хаяг» тусдаа.
   ============================================================ */

:root {
  --tm-brand:      #0d2b4e;
  --tm-brand-deep: #061a31;
  --tm-brand-lift: #17497c;
  --tm-gold:       #ffd900;

  --tm-paper:      #ffffff;
  --tm-panel:      #f2f5f8;
  --tm-panel-head: #e2e9f0;
  --tm-rule:       #c6d0da;
  --tm-rule-soft:  #dde4eb;
  --tm-text:       #1a1a1a;
  --tm-muted:      #56626e;
  --tm-link:       #0d2b4e;

  --tm-in-force:   #2e7d32;
  --tm-amended:    #b26500;
  --tm-repealed:   #757575;

  /* EUI нь Arial дээр тогтдог; кирилл бүрэн орно. Хуулийн бичвэрт л serif —
     EUR-Lex-ийн адил, мөн хэвлэмэл эмхэтгэлийн уламжлал. */
  --tm-sans:  Arial, "Liberation Sans", "PT Sans", "Segoe UI", Roboto, sans-serif;
  --tm-serif: Georgia, "PT Serif", "Liberation Serif", "Times New Roman", serif;
  --tm-mono:  "Courier New", "PT Mono", monospace;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--tm-paper);
  color: var(--tm-text);
  font-family: var(--tm-sans);
  font-size: 16px;
  line-height: 1.55;
}

a { color: var(--tm-link); }

/* Гарын фокус нь ХАРАГДАНА — нийтийн порталд гарын навигаци илүү чухал.
   MNLES ижил хэлбэр ашигладаг: 2px алтан хүрээ, 3px зайтай. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--tm-gold);
  outline-offset: 3px;
}

.tm-skip {
  position: absolute;
  left: -9999px;
  background: var(--tm-brand);
  color: #fff;
  padding: .5rem .9rem;
  z-index: 10;
}
.tm-skip:focus { left: .5rem; top: .5rem; }

/* ── Тууз ─────────────────────────────────────────────────── */
.tm-toolbar {
  background: var(--tm-brand);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .5rem 1rem;
  flex-wrap: wrap;
}
.tm-lockup { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: inherit; }
.tm-lockup img { width: 20px; height: 40px; display: block; }
.tm-abbr { display: block; font-size: 1.15rem; font-weight: 700; line-height: 1.1; letter-spacing: .02em; }
.tm-full { display: block; font-size: .72rem; font-weight: 400; line-height: 1.2; opacity: .85; }
.tm-lockup:hover .tm-abbr { text-decoration: underline; text-underline-offset: 3px; }
.tm-nav { display: flex; gap: 1.1rem; font-size: .9rem; }
.tm-nav a { color: #fff; text-decoration: none; }
.tm-nav a:hover { text-decoration: underline; }
@media (max-width: 34rem) { .tm-full { display: none; } }

/* ── Hero ─────────────────────────────────────────────────── */
.tm-hero {
  background-color: #0d2b4e;
  background-image:
    radial-gradient(75% 130% at 92% -12%, rgba(125, 185, 245, .30) 0%, rgba(125, 185, 245, 0) 60%),
    linear-gradient(112deg, #061a31 0%, #0d2b4e 46%, #17497c 100%);
  border-bottom: 3px solid var(--tm-gold);
  padding: 2rem 1rem 2rem 2.5rem;
}
.tm-hero h1 {
  color: #fff;
  font-size: clamp(1.3rem, 3.4vw, 1.9rem);
  font-weight: 400;
  line-height: 1.25;
  max-width: 32rem;
  margin: 0;
}
.tm-hero .tm-hero-actions { display: flex; gap: .8rem; margin-top: 1.1rem; flex-wrap: wrap; }
.tm-hero a.tm-hero-btn {
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .65);
  color: #fff;
  font-size: .88rem;
  padding: .4rem .9rem;
  text-decoration: none;
}
.tm-hero a.tm-hero-btn:hover, .tm-hero a.tm-hero-btn:focus-visible {
  background: rgba(255, 255, 255, .22);
  border-color: var(--tm-gold);
}

/* ── Ерөнхий байрлал ──────────────────────────────────────── */
.tm-wrap { max-width: 64rem; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
.tm-crumb {
  background: var(--tm-panel);
  border-bottom: 1px solid var(--tm-rule);
  padding: .4rem 1rem;
  font-size: .8rem;
  color: var(--tm-muted);
}
.tm-crumb a { text-decoration: none; }

h2 { font-size: 1.25rem; margin: 0 0 .6rem; }

/* ── Хайлт ────────────────────────────────────────────────── */
.tm-searchrow { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.tm-searchrow input[type="search"], .tm-searchrow select {
  font-family: var(--tm-sans);
  font-size: .95rem;
  padding: .45rem .6rem;
  border: 1px solid var(--tm-rule);
  background: var(--tm-paper);
  color: var(--tm-text);
}
.tm-searchrow input[type="search"] { flex: 1 1 18rem; }
.tm-btn {
  background: var(--tm-brand);
  color: #fff;
  border: 1px solid var(--tm-brand);
  font-family: var(--tm-sans);
  font-size: .9rem;
  padding: .45rem 1.1rem;
  cursor: pointer;
}

/* ── Карт ба жагсаалт ─────────────────────────────────────── */
.tm-cards { display: flex; gap: 1rem; flex-wrap: wrap; }
.tm-card { flex: 1 1 20rem; border: 1px solid var(--tm-rule); }
.tm-card > h2 {
  margin: 0;
  background: var(--tm-panel-head);
  border-bottom: 1px solid var(--tm-rule);
  padding: .5rem .7rem;
  font-size: .78rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.tm-card > h2::before { content: ""; width: .55rem; height: .55rem; background: var(--tm-gold); flex: none; }
.tm-card ul { list-style: none; margin: 0; padding: .25rem .7rem .6rem; }
.tm-card li { padding: .5rem 0; border-bottom: 1px solid var(--tm-rule-soft); }
.tm-card li:last-child { border-bottom: 0; }
.tm-card a { text-decoration: none; font-weight: 700; font-size: .93rem; }
.tm-card a:hover { text-decoration: underline; }
.tm-meta { font-size: .8rem; color: var(--tm-muted); margin: .15rem 0 0; font-variant-numeric: tabular-nums; }

.tm-hit { border: 1px solid var(--tm-rule-soft); border-left: 3px solid var(--tm-rule); padding: .65rem .8rem; margin-bottom: .6rem; }
.tm-hit.is-in-force { border-left-color: var(--tm-in-force); }
.tm-hit.is-amended  { border-left-color: var(--tm-amended); }
.tm-hit.is-repealed { border-left-color: var(--tm-repealed); }
.tm-hit .tm-hit-head { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.tm-hit a { font-weight: 700; text-decoration: none; }
.tm-hit a:hover { text-decoration: underline; }

/* Төлөв нь ӨНГӨ ба ХЭЛБЭР хоёуланг сольдог — өнгө ялгахгүй хүнд ч уншигдана. */
.tm-status { display: inline-flex; align-items: center; gap: .4rem; font-size: .84rem; font-weight: 700; }
.tm-status::before { content: ""; width: .6rem; height: .6rem; border-radius: 50%; background: currentColor; flex: none; }
.tm-status.is-in-force { color: var(--tm-in-force); }
.tm-status.is-amended { color: var(--tm-amended); }
.tm-status.is-amended::before { border-radius: 0; transform: rotate(45deg); }
.tm-status.is-repealed { color: var(--tm-repealed); }
.tm-status.is-repealed::before { border-radius: 0; height: 2px; width: .7rem; }
.tm-status.is-not-yet { color: var(--tm-muted); }

/* ── Актын хуудас ─────────────────────────────────────────── */
.tm-tabs { display: flex; border-bottom: 3px solid var(--tm-brand); flex-wrap: wrap; margin-bottom: 1.25rem; }
.tm-tabs a {
  padding: .45rem .9rem;
  font-size: .87rem;
  border: 1px solid var(--tm-rule);
  border-bottom: 0;
  background: var(--tm-panel);
  text-decoration: none;
  margin-right: .2rem;
}
.tm-tabs a[aria-current="page"] { background: var(--tm-brand); color: #fff; border-color: var(--tm-brand); font-weight: 700; }

.tm-actions { display: flex; flex-wrap: wrap; gap: .1rem .9rem; font-size: .8rem; margin-bottom: 1rem; }

.tm-doc { display: grid; grid-template-columns: 17rem 1fr; gap: 1.25rem; align-items: start; }
@media (max-width: 52rem) { .tm-doc { grid-template-columns: 1fr; } }

.tm-panel { border: 1px solid var(--tm-rule); margin-bottom: 1rem; }
.tm-panel > h2 {
  margin: 0;
  background: var(--tm-panel-head);
  border-bottom: 1px solid var(--tm-rule);
  padding: .4rem .65rem;
  font-size: .75rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.tm-panel .tm-panel-body { padding: .55rem .65rem; font-size: .85rem; }

table.tm-versions { border-collapse: collapse; width: 100%; font-size: .79rem; }
table.tm-versions th, table.tm-versions td { border: 1px solid var(--tm-rule-soft); padding: .28rem .4rem; text-align: left; }
table.tm-versions thead th { background: var(--tm-panel); font-weight: 700; }
table.tm-versions td { font-variant-numeric: tabular-nums; }
table.tm-versions tr.is-current td { background: var(--tm-panel); font-weight: 700; }
table.tm-versions tr.is-current td:first-child { border-left: 3px solid var(--tm-gold); }
table.tm-versions a { text-decoration: none; }

.tm-kicker { font-size: .79rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tm-muted); margin: 0 0 .3rem; }
.tm-title { margin: 0 0 .5rem; font-size: 1.35rem; line-height: 1.28; }

.tm-idblock {
  border: 1px solid var(--tm-rule);
  border-left: 3px solid var(--tm-brand);
  background: var(--tm-panel);
  padding: .6rem .7rem;
  font-size: .85rem;
  margin: .75rem 0 1.1rem;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .28rem .7rem;
}
.tm-idblock dt { color: var(--tm-muted); }
.tm-idblock dd { margin: 0; font-variant-numeric: tabular-nums; }
.tm-idblock code { font-family: var(--tm-mono); font-size: .82rem; }

.tm-asof {
  border: 1px solid var(--tm-rule);
  border-left: 3px solid var(--tm-gold);
  padding: .5rem .7rem;
  font-size: .85rem;
  margin-bottom: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem .8rem;
}
.tm-asof input[type="date"] {
  font-family: var(--tm-mono);
  border: 1px solid var(--tm-rule);
  padding: .1rem .35rem;
  background: var(--tm-paper);
  color: var(--tm-text);
}

/* ── Хуулийн бичвэр (AknHtmlRenderer-ийн гаралт) ──────────── */
.tm-text { font-family: var(--tm-serif); font-size: 1rem; line-height: 1.65; max-width: 40rem; }
.tm-text .akn-chapter, .tm-text .akn-part { text-align: center; margin: 1.6rem 0 1rem; }
.tm-text .akn-chapter > .akn-num, .tm-text .akn-part > .akn-num {
  display: block;
  font-family: var(--tm-sans);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tm-muted);
}
.tm-text .akn-chapter > .akn-heading, .tm-text .akn-part > .akn-heading { font-weight: 700; letter-spacing: .03em; }
.tm-text .akn-article { margin: 0 0 1.2rem; text-align: left; }
.tm-text .akn-num { font-weight: 700; }
.tm-text .akn-heading { font-weight: 700; }
.tm-text .akn-p { margin: .3rem 0; text-align: justify; hyphens: auto; }
.tm-text .akn-paragraph { display: block; margin-top: .3rem; }
.tm-text .akn-quote { margin-left: 1rem; border-left: 2px solid var(--tm-rule); padding-left: .7rem; }

/* Зүйлийн хаяг — hover дээр гарна, гарын фокусаар ч гарна. */
.tm-text .akn-anchor {
  font-family: var(--tm-mono);
  font-size: .78rem;
  text-decoration: none;
  margin-left: .35rem;
  opacity: 0;
  transition: opacity .12s ease;
}
.tm-text section:hover > .akn-anchor,
.tm-text .akn-anchor:focus-visible { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .tm-text .akn-anchor { transition: none; } }

.tm-empty { color: var(--tm-muted); font-style: italic; }

footer.tm-foot {
  border-top: 3px solid var(--tm-gold);
  margin-top: 3rem;
  padding: 1rem;
  font-size: .84rem;
  color: var(--tm-muted);
}

@media print {
  .tm-toolbar, .tm-hero, .tm-tabs, .tm-actions, .tm-asof, .tm-crumb, .akn-anchor { display: none; }
  .tm-doc { grid-template-columns: 1fr; }
}

/* Хуудаслалт — хайлтын үр дүн урт байх тул. */
.tm-pager { display: flex; align-items: center; gap: 1rem; margin-top: 1.25rem; font-size: .9rem; }
.tm-pager span { color: var(--tm-muted); font-variant-numeric: tabular-nums; }