/* ------------------------------------------------------------------
   boot.css - the SGI start up screen.

   One background for the whole sequence: a blue to slate purple wash,
   with the welcome text down in the bottom left and the maker's name in
   yellow in the bottom right. The PROM log and the start up panel are
   grey Motif boxes laid on top of it. Nothing here is a black console.

   The sequence goes dark three times, the way a real machine does when
   the graphics board is set up again. #boot.dark paints the screen
   black and takes away everything on it.
   ------------------------------------------------------------------ */

#boot {
  position: fixed;
  inset: 0;
  z-index: 8800;
  overflow: hidden;
  background: linear-gradient(180deg, var(--boot-top) 0%, var(--boot-bottom) 100%);
}

/* A black screen: before the graphics board has anything to show, and
   again each time it is set up. Nothing is drawn over it. */
#boot.dark {
  background: #000000;
}

#boot.dark > * {
  visibility: hidden;
}

/* --- The welcome text ------------------------------------------------
   Serif, purple, with a pale shadow under it, exactly like the splash
   an Indigo or an Octane put up while it started. */

#boot-welcome {
  position: absolute;
  left: 4%;
  bottom: 11%;
  color: var(--boot-purple);
  font-family: "Times New Roman", Times, serif;
}

#boot-welcome .small {
  font-size: clamp(19px, 2.3vw, 34px);
  letter-spacing: 0.55em;
  text-shadow: 1px 1px 0 var(--boot-shadow);
}

/* IRIX does not line up with WELCOME TO. It is set in from the left by
   about one of its own letters. See design/old_copy_boot.png. */
#boot-welcome .big {
  margin-top: 0.15em;
  margin-left: 1.1em;
  font-size: clamp(70px, 11.5vw, 170px);
  font-style: italic;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.04em;
  text-shadow: 3px 3px 0 var(--boot-shadow);
}

#boot-maker {
  position: absolute;
  right: 3%;
  bottom: 4.5%;
  color: var(--boot-yellow);
  font-family: Helvetica, Arial, sans-serif;
  font-size: clamp(15px, 1.9vw, 30px);
  font-style: italic;
  font-weight: bold;
}

/* --- The PROM log ----------------------------------------------------
   A grey box in the middle of the screen with white fixed width text,
   which is how IRIX shows the log while it starts. */

#boot-console {
  position: absolute;
  left: 50%;
  top: 6%;
  transform: translateX(-50%);
  width: min(62vw, 800px);
  height: 86%;
  padding: 8px;
  background: #ababab;
  border: 1px solid #484848;
  box-shadow: 1px 1px 0 #ffffff inset;
}

#boot-console .screen {
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 6px 10px;
  background: var(--boot-console);
  border: 1px solid #484848;
}

/* The lines sit in their own box because .crisp needs a see through
   background to work on. The grey above is painted by .screen. */
#boot-console .lines {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.55;
  color: #ffffff;
  white-space: pre-wrap;
}

/* An empty line in the log still takes a whole line. */
#boot-console .lines > div {
  min-height: 1.55em;
}

/* --- The release notice ---------------------------------------------
   Three lines of pale blue in the bottom right corner, put there by
   the window server. They stay on the screen from the boot log to the
   end of the login. See design/irix_release.png. */

#boot-release {
  position: absolute;
  right: 2.2%;
  bottom: 3.5%;
  font-family: var(--font-label);
  font-size: clamp(13px, 1.15vw, 18px);
  line-height: 1.35;
  color: var(--boot-release);
}

/* --- The start up panel ----------------------------------------------
   The small grey box with the hourglass and one message in it. IRIX
   shows it twice: with the "Stop for Maintenance" button while the
   system starts, and without it once the log is done. The message is
   set in a bold serif face, not in the slanted one the desktop uses.
   See design/starting_up.png and design/coming_up.png. */

#boot-panel {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

#boot-panel .panel {
  padding: 4px;
  background: var(--face);
  border: 1px solid #000;
  box-shadow:
    inset 2px 2px 0 var(--face-lt),
    inset -2px -2px 0 var(--face-dk),
    3px 3px 0 rgba(0, 0, 0, 0.35);
}

#boot-panel .row {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px;
}

#boot-panel img {
  flex: none;
  width: 28px;
  height: 28px;
  padding: 2px;
  background: #c8b4d0;
  border: 1px solid #000;
}

#boot-panel .msg {
  flex: 1;
  padding: 3px 20px;
  background: var(--face);
  border: 1px solid #000;
  font-family: "Times New Roman", Times, serif;
  font-size: 21px;
  font-weight: bold;
  color: var(--ink);
  white-space: nowrap;
}

/* The button is only on the panel shown while the system starts. It
   does nothing: a real machine would drop to maintenance mode. */
#boot-panel .foot {
  display: none;
  justify-content: flex-end;
  padding: 0 4px 2px;
}

#boot-panel.with-button .foot {
  display: flex;
}

#boot-panel .stop {
  padding: 3px 12px;
  background: var(--face);
  border: 2px solid;
  border-color: var(--face-lt) var(--face-dk) var(--face-dk) var(--face-lt);
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: bold;
  font-style: italic;
  color: var(--ink);
}