/* Machine Learning course: the few rules course-ml.css does not carry.
   Mirrors site/deeplearning/assets/dl.css, which does the same job for the
   sibling course. Everything else on these pages comes from course-ml.css. */

/* A numbered variant of the .lo list, for ordered steps. */
ol.lo.num{counter-reset:lo}
ol.lo.num li{counter-increment:lo}
ol.lo.num li::before{
  content:counter(lo);
  width:1.35rem;height:1.35rem;line-height:1.35rem;
  text-align:center;border-radius:50%;
  background:var(--accent-soft);color:var(--accent-strong);
  font-family:var(--mono);font-size:.72rem;font-weight:700;
}

/* Icon colours inside a download button. course-ml.css has .i-data only. */
.mat-btn .i-page{color:var(--accent)}
.mat-btn .i-pdf{color:#b23b3b}
.mat-btn .i-book{color:var(--accent-strong)}

/* ---------------------------------------------------------------------
   Data dictionary tables.

   A dictionary is wider than the page, so it scrolls inside its own box
   rather than pushing the body sideways. The first column is the column
   name and is always mono, so a reader can match the page against the
   file without guessing.
   ------------------------------------------------------------------ */
.dict-wrap{
  width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;
  margin:1rem 0 1.35rem;
  border:1px solid var(--line-strong);border-radius:8px;background:#fff;
  box-shadow:0 8px 22px rgba(26,26,23,.06);
}
.dict-wrap table{min-width:880px;table-layout:auto;margin:0;font-size:1rem}
.dict-wrap table.narrow{min-width:560px}

.dictionary th{
  padding:.9rem 1rem!important;
  background:var(--accent-soft);color:var(--accent-strong)!important;
  font-size:.8rem!important;font-weight:700!important;letter-spacing:.1em!important;
  white-space:nowrap;
}
.dictionary td{
  padding:.95rem 1rem!important;
  font-size:1.02rem;line-height:1.55;color:var(--ink-soft);
}
.dictionary tbody tr:nth-child(even) td{
  background:color-mix(in srgb,var(--paper) 62%,white);
}
.dictionary td:first-child{
  font-family:var(--mono);font-size:.9rem;font-weight:700;
  color:var(--accent);white-space:nowrap;
}
.dictionary td:first-child code{font-size:1em;white-space:nowrap;overflow-wrap:normal}
.dictionary td:nth-child(2){
  font-family:var(--mono);font-size:.9rem;color:var(--accent-strong);white-space:nowrap;
}

/* The target row is the one a reader looks for first. */
.dictionary tr.is-target td{background:color-mix(in srgb,var(--accent-soft) 55%,white)!important}
.dictionary tr.is-target td:first-child::after{content:" target";
  font-family:var(--sans);font-size:.62rem;letter-spacing:.08em;
  color:var(--accent-strong);opacity:.75}

/* A column that exists in the file but must never be fed to a model. */
.dictionary tr.is-blocked td:nth-child(4){color:#8a3232;font-weight:600}

/* The eligibility ladder: a count that falls step by step. */
.ladder td:nth-child(2){
  font-family:var(--mono);font-weight:700;color:var(--accent-strong);
  text-align:right;white-space:nowrap;
}
.ladder tbody tr:last-child td{border-top:2px solid var(--line-strong)}
.ladder tbody tr:last-child td:nth-child(2){color:var(--accent)}

@media (max-width:680px){
  .dictionary td{font-size:1rem}
  .dict-wrap{margin-right:-.15rem}
}

/* ---------------------------------------------------------------------
   course-ml.css dims a whole locked day card to 72 per cent. On this course
   a locked card still carries released material: the lecture deck may be
   unreleased while that day's notebook and data are not. Opacity on a parent
   cannot be undone by a child, so the card stays at full strength and only
   the unreleased button is dimmed, which .mat-btn.disabled already does.
   ------------------------------------------------------------------ */
.daycard.locked{opacity:1}
.daycard.locked .dc-t{color:var(--ink-soft)}
.daycard.locked .dc-lock{opacity:.8}