/*
 * extra.css - VSCode風スタイル for mylab-docs.pages.dev
 * safari-mylab-docs.css をMkDocs Material用に変換
 * コードブロック・シンタックスハイライトはMkDocs Materialのデフォルトを維持
 */

/* ==========================================================================
   Base Typography
   ========================================================================== */

/* スマホ: 14px */
.md-typeset {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", system-ui, "Ubuntu", "Droid Sans", sans-serif;
  font-size: 14px;
  line-height: 22px;
  word-wrap: break-word;
}

/* PC（960px以上）: 16px */
@media screen and (min-width: 60em) {
  .md-typeset {
    font-size: 16px;
    line-height: 26px;
  }
}

/* ==========================================================================
   Headings
   ========================================================================== */

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  font-weight: 600;
  margin-top: 24px;
  margin-bottom: 16px;
  line-height: 1.25;
}

.md-typeset h1 {
  font-size: 2em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

.md-typeset h2 {
  font-size: 1.5em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

.md-typeset h3 { font-size: 1.25em; }
.md-typeset h4 { font-size: 1em; }
.md-typeset h5 { font-size: 0.875em; }
.md-typeset h6 { font-size: 0.85em; }

/* ==========================================================================
   Paragraphs & Lists
   ========================================================================== */

.md-typeset p {
  margin-bottom: 16px;
}

.md-typeset li p {
  margin-bottom: 0.7em;
}

.md-typeset ul,
.md-typeset ol {
  margin-bottom: 0.7em;
}

/* ==========================================================================
   Links
   ========================================================================== */

.md-typeset a {
  text-decoration: none;
}

.md-typeset a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   Tables
   ========================================================================== */

.md-typeset table {
  border-collapse: collapse;
  margin-bottom: 0.7em;
}

.md-typeset th {
  text-align: left;
}

.md-typeset th,
.md-typeset td {
  padding: 5px 10px;
}

/* ==========================================================================
   Blockquote
   ========================================================================== */

.md-typeset blockquote {
  margin: 0;
  padding: 0px 16px 0 10px;
  border-left-width: 5px;
  border-left-style: solid;
  border-radius: 2px;
}

/* ==========================================================================
   Horizontal Rule
   ========================================================================== */

.md-typeset hr {
  border: 0;
  height: 1px;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

/* ==========================================================================
   ページ冒頭のパス表示（hooks/page_path.py が挿入する要素）
   ========================================================================== */

.page-filepath {
  display: inline-block;
  font-family: "SF Mono", Monaco, Menlo, Consolas, "Ubuntu Mono", monospace;
  font-size: 0.78em;
  padding: 3px 10px;
  border-radius: 4px;
  margin-bottom: 20px;
  opacity: 0.75;
}

/* ==========================================================================
   Dark Theme（MkDocs Material の slate スキーム）
   ========================================================================== */

[data-md-color-scheme="slate"] .md-typeset a {
  color: #3794ff;
}

[data-md-color-scheme="slate"] .md-typeset blockquote {
  border-left-color: rgba(255, 255, 255, 0.25);
  background-color: rgba(255, 255, 255, 0.04);
}

[data-md-color-scheme="slate"] .page-filepath {
  background-color: rgba(255, 255, 255, 0.07);
  color: #9cdcfe;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

/* ==========================================================================
   Light Theme（MkDocs Material の default スキーム）
   ========================================================================== */

[data-md-color-scheme="default"] .md-typeset a {
  color: #4080d0;
}

[data-md-color-scheme="default"] .md-typeset blockquote {
  border-left-color: rgba(0, 0, 0, 0.18);
  background-color: rgba(0, 0, 0, 0.04);
}

[data-md-color-scheme="default"] .page-filepath {
  background-color: rgba(0, 0, 0, 0.05);
  color: #795e26;
  border: 1px solid rgba(0, 0, 0, 0.10);
}