/*
 * custom-override.css  –  v2
 * Slate/ivory palette with higher contrast.
 * Place in /assets/css/ and load via _includes/head/custom.html:
 *   <link rel="stylesheet" href="/assets/css/custom-override.css">
 */

/* ── Google Fonts ─────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap');

/* ── Design tokens ────────────────────────────────────────────────────── */
:root {
  --ivory:        #F8F7F4;
  --ivory-2:      #EFEDE8;
  --rule:         #DDDAD3;
  --ink:          #18181B;
  --ink-muted:    #52525B;
  --ink-faint:    #A1A1AA;
  --accent:       #3D5A80;     /* slate blue – links, highlights  */
  --accent-hover: #274060;
  --serif: 'DM Serif Display', Georgia, serif;
  --sans:  'DM Sans', system-ui, sans-serif;
}

/* ── Base ─────────────────────────────────────────────────────────────── */
html, body {
  background-color: var(--ivory) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
}

a                    { color: var(--accent) !important; }
a:visited            { color: var(--accent) !important; }
a:hover,
a:visited:hover      {
  color: var(--accent-hover) !important;
  text-underline-offset: 3px !important;
}

/* ── Masthead ─────────────────────────────────────────────────────────── */
.masthead,
.masthead__inner-wrap {
  background-color: var(--ivory) !important;
  border-bottom: 1px solid var(--rule) !important;
  box-shadow: none !important;
}

.site-title,
.site-title:visited {
  font-family: var(--serif) !important;
  color: var(--ink) !important;
}
.site-title:hover { color: var(--accent) !important; text-decoration: none !important; }

.site-subtitle {
  font-family: var(--sans) !important;
  font-size: 0.7rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--ink-faint) !important;
}

.greedy-nav,
.greedy-nav__toggle          { background: var(--ivory) !important; }
.greedy-nav a,
.greedy-nav .visible-links a {
  font-family: var(--sans) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--ink-muted) !important;
}
.greedy-nav a:hover,
.greedy-nav .visible-links a:hover {
  color: var(--ink) !important;
  text-decoration: none !important;
}
.greedy-nav__toggle { color: var(--ink-muted) !important; }

/* ── Sidebar / author profile ─────────────────────────────────────────── */
.sidebar { background-color: transparent !important; }

.author__name {
  font-family: var(--serif) !important;
  font-size: 1.25rem !important;
  font-weight: 400 !important;
  color: var(--ink) !important;
}

.author__bio {
  font-style: italic !important;
  font-size: 0.84rem !important;
  color: var(--ink-faint) !important;
}

.author__avatar img {
  border: 3px solid var(--ivory-2) !important;
  outline: 1px solid var(--rule) !important;
  box-shadow: none !important;
}

/* "Follow" button that opens the URLs popout */
.author__urls-wrapper button,
.author__urls-wrapper .btn {
  font-family: var(--sans) !important;
  font-size: 0.8rem !important;
  background: transparent !important;
  color: var(--ink-muted) !important;
  border: 1px solid var(--rule) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
}
.author__urls-wrapper button:hover,
.author__urls-wrapper .btn:hover {
  background: var(--ivory-2) !important;
  color: var(--ink) !important;
}

/* The popout box itself */
.author__urls {
  background: var(--ivory) !important;
  border: 1px solid var(--rule) !important;
  box-shadow: none !important;
  border-radius: 4px !important;
}

/* Every link row inside the popout */
.author__urls li,
.author__urls-wrapper ul li {
  border-bottom: 1px solid var(--rule) !important;
  background: transparent !important;
}
.author__urls li:last-child,
.author__urls-wrapper ul li:last-child {
  border-bottom: none !important;
}

.author__urls li a,
.author__urls-wrapper ul li a {
  font-family: var(--sans) !important;
  font-size: 0.84rem !important;
  color: var(--ink-muted) !important;
  background: transparent !important;
  padding: 0.45rem 0.75rem !important;
}
.author__urls li a:hover,
.author__urls-wrapper ul li a:hover {
  color: var(--accent) !important;
  background: var(--ivory-2) !important;
}

/* Icons inside the author URLs list */
.author__urls .svg-inline--fa,
.author__urls .fas,
.author__urls .fab,
.author__urls .far,
.author__urls [class*="fa-"] {
  color: var(--ink-faint) !important;
  width: 1em !important;
}

/* Location / employer line above the Follow button */
.author__content .author__location,
.author__content p {
  font-size: 0.82rem !important;
  color: var(--ink-faint) !important;
}

/* ── Headings ─────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.page__title,
.archive__item-title {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  color: var(--ink) !important;
  letter-spacing: -0.01em !important;
}
h1, .page__title { font-size: 2rem !important; }
h2               { font-size: 1.5rem !important; }
h3               { font-size: 1.2rem !important; }

p, li, td, th {
  font-family: var(--sans) !important;
  color: var(--ink-muted) !important;
}

/* ── Post list – tighter spacing ──────────────────────────────────────── */
.list__item {
  padding-bottom: 0.6rem !important;
  margin-bottom: 0 !important;
}

/* Remove the large gap Minimal Mistakes adds between archive items */
.archive__item {
  border-bottom: 1px solid var(--rule) !important;
  padding-top: 0.7rem !important;
  padding-bottom: 0.7rem !important;
  margin-bottom: 0 !important;
}
.archive__item:last-child { border-bottom: none !important; }

.archive__item-title {
  margin-top: 0 !important;
  margin-bottom: 0.15rem !important;
}
.archive__item-title a,
.archive__item-title a:visited {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  font-size: 1.05rem !important;
  color: var(--ink) !important;
  text-decoration: none !important;
}
.archive__item-title a:hover {
  color: var(--accent) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.archive__item-excerpt {
  font-size: 0.83rem !important;
  color: var(--ink-faint) !important;
  margin-top: 0.15rem !important;
  margin-bottom: 0 !important;
}

/* Date / read-time meta */
.page__meta,
.page__date {
  font-size: 0.76rem !important;
  color: var(--ink-faint) !important;
  font-family: var(--sans) !important;
  margin-top: 0.1rem !important;
  margin-bottom: 0 !important;
}

/* Section label ("Recent posts") */
.archive__subtitle,
.taxonomy__section-label {
  font-family: var(--sans) !important;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--ink-faint) !important;
  border-bottom: 1px solid var(--rule) !important;
  margin-bottom: 0 !important;
}

/* ── Code ─────────────────────────────────────────────────────────────── */
pre, code {
  background-color: var(--ivory-2) !important;
  border: 1px solid var(--rule) !important;
  color: #2D5986 !important;
  font-size: 0.87rem !important;
}
pre code { border: none !important; background: transparent !important; }
code { padding: 0.15em 0.4em !important; border-radius: 3px !important; }

/* ── Blockquote ───────────────────────────────────────────────────────── */
blockquote {
  border-left: 3px solid var(--accent) !important;
  background: var(--ivory-2) !important;
  color: var(--ink-muted) !important;
  font-style: italic !important;
}

/* ── HR ───────────────────────────────────────────────────────────────── */
hr { border-color: var(--rule) !important; }

/* ── Tables ───────────────────────────────────────────────────────────── */
th {
  background-color: var(--ivory-2) !important;
  color: var(--ink) !important;
  font-weight: 500 !important;
  border-bottom: 1px solid var(--rule) !important;
}
td { border-bottom: 1px solid var(--rule) !important; }
tr:nth-child(even) td { background-color: var(--ivory-2) !important; }

/* ── Pagination ───────────────────────────────────────────────────────── */
.pagination a,
.pagination--pager {
  font-family: var(--sans) !important;
  background: var(--ivory-2) !important;
  color: var(--ink-muted) !important;
  border: 1px solid var(--rule) !important;
  box-shadow: none !important;
}
.pagination a:hover {
  background: var(--rule) !important;
  color: var(--ink) !important;
}

/* ── Buttons ──────────────────────────────────────────────────────────── */
.btn--primary {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.btn--primary:hover {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}
.btn--inverse {
  background-color: transparent !important;
  border-color: var(--rule) !important;
  color: var(--ink-muted) !important;
  box-shadow: none !important;
}
.btn--inverse:hover {
  background-color: var(--ivory-2) !important;
  color: var(--ink) !important;
}

/* ── Footer ───────────────────────────────────────────────────────────── */
.page__footer {
  background-color: var(--ivory-2) !important;
  border-top: 1px solid var(--rule) !important;
  color: var(--ink-faint) !important;
}
.page__footer a,
.page__footer a:visited      { color: var(--ink-faint) !important; }
.page__footer a:hover        { color: var(--accent) !important; }
.page__footer-copyright      { font-size: 0.78rem !important; color: var(--ink-faint) !important; }

/* ── Search ───────────────────────────────────────────────────────────── */
.search__toggle             { color: var(--ink-muted) !important; }
.search-content .search-input {
  font-family: var(--sans) !important;
  border-bottom-color: var(--rule) !important;
  color: var(--ink) !important;
  background: var(--ivory) !important;
}
