/* =========================================================================
   ChadKar.com overrides for Naoto 1.2.0
   Loaded after screen.css from default.hbs.
   Everything here exists because Ghost admin cannot reach it.
   To roll back: delete this file and remove the matching <link> in default.hbs.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Metadata contrast
   Naoto ships --tertiary-text-color: rgba(5,5,5,.5) = 3.84:1 on white.
   WCAG AA needs 4.5:1 for body-size text. 0.58 gives 5.10:1 and keeps
   metadata visibly quieter than body copy.
   Dark mode ships rgba(255,255,255,.45) = 4.48:1, a hair under. 0.55 = 6.06:1.
   ------------------------------------------------------------------------- */
:root {
  --tertiary-text-color: rgba(5, 5, 5, 0.58);
}

/* -------------------------------------------------------------------------
   2. Accent per theme
   Ghost's accent colour is a single hex. #1F4B99 is 8.3:1 on white but only
   2.1:1 on the dark ground (#17191E), so links, active TOC items and card
   accents become unreadable in dark mode. #8FB4E8 is 8.3:1 on dark.
   ------------------------------------------------------------------------- */
:root[data-theme="dark"] {
  --tertiary-text-color: rgba(255, 255, 255, 0.55);
  --brand-color: #8FB4E8;
}

/* Primary buttons take their label from --primary-text-color-invert, which
   stays near-white in both themes. With a light accent behind it, that label
   has to flip to ink or the button is unreadable. */
:root[data-theme="dark"] .button.button-primary {
  color: #17191E;
}

/* -------------------------------------------------------------------------
   3. Professional boundary statement
   Rendered by partials/footer.hbs. Naoto's footer has no content slot, so
   the markup is added in the template and styled here.
   ------------------------------------------------------------------------- */
.ck-boundary {
  max-width: 60rem;
  margin: 2.4rem auto 0;
  padding: 0 2rem;
  font-size: 1.3rem;
  line-height: 1.6;
  color: var(--tertiary-text-color);
  text-align: center;
  text-wrap: pretty;
}

/* -------------------------------------------------------------------------
   4. Reading comfort in long-form posts
   Naoto sets body copy at 18px/1.5. At a 600px measure that is tight for
   1500-word essays. 1.65 costs nothing and measurably improves readability.
   Scoped to article body only so cards, nav and metadata are untouched.
   ------------------------------------------------------------------------- */
.single-content .gh-content p,
.single-content .gh-content li {
  line-height: 1.65;
}

/* -------------------------------------------------------------------------
   5. Section headings on a text-only feed
   With feature images off, the feed relies entirely on type. Give the
   uppercase section labels slightly more air so they read as labels
   rather than as shouting.
   ------------------------------------------------------------------------- */
.section-title {
  letter-spacing: 1.6px;
}

/* -------------------------------------------------------------------------
   6. Skip link
   Naoto ships no skip-to-content link. Added in default.hbs; styled here.
   Visible only on keyboard focus.
   ------------------------------------------------------------------------- */
.ck-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: 1.2rem 1.8rem;
  background: var(--background-color);
  color: var(--primary-text-color);
  border: 2px solid var(--brand-color);
  border-radius: var(--radius-small);
  font-size: 1.5rem;
  text-decoration: none;
}

.ck-skip-link:focus {
  left: 1.6rem;
  top: 1.6rem;
}