/* =============================================================
   tidycreel extra.css — Phase 53: Structural/Non-content CSS
   Phase 54 additions: hero section, badge styling (see bottom)
   ============================================================= */

/* ---- Navbar ---- */
/* Belt-and-suspenders supplement to navbar.bg: primary in _pkgdown.yml */
.navbar {
  background-color: #0b3b5e !important;
}

.navbar .nav-link,
.navbar .navbar-brand {
  color: #ffffff !important;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: #f47d65 !important;
  transition: color 0.3s ease-in-out;
}

a:hover {
  color: #f47d65;
  text-decoration: underline;
  transition: color 0.3s ease-in-out;
}

/* ---- Code Blocks ---- */
/* Dark navy-tinted background for professional look matching brand palette */
pre,
pre.sourceCode {
  background-color: #1a2a3a !important;
  color: #e8f4f8 !important;
  border-radius: 0.375rem;
  padding: 1rem;
}

/* Bootstrap 5 sets --bs-code-color on <code> directly, overriding inherited
   color from <pre>. Force plain output blocks to read from the parent pre. */
pre code,
pre.sourceCode code {
  color: inherit !important;
  background-color: transparent !important;
}

/* Pandoc syntax token colors for dark background.
   Default pandoc tokens are styled for light backgrounds; override for legibility. */
.sourceCode span,
.sourceCode code {
  color: #e8f4f8 !important;  /* default token: light blue-white */
}
.sourceCode .fu { color: #7ec8e3 !important; }  /* functions: sky blue */
.sourceCode .kw { color: #f0b429 !important; }  /* keywords: amber */
.sourceCode .st { color: #a8d8a8 !important; }  /* strings: soft green */
.sourceCode .co { color: #8899aa !important; }  /* comments: muted blue-grey */
.sourceCode .dv,
.sourceCode .fl { color: #f4a261 !important; }  /* numbers: warm orange */
.sourceCode .op { color: #e8f4f8 !important; }  /* operators: default light */
.sourceCode .va { color: #e8f4f8 !important; }  /* variables: default light */
.sourceCode .at { color: #c3e88d !important; }  /* attributes: light green */
/* R example output tokens */
.sourceCode .r-out { color: #aac8e0 !important; }
.sourceCode .r-msg { color: #8899aa !important; }
.sourceCode .r-wrn { color: #f0b429 !important; }
.sourceCode .r-err { color: #ff6b6b !important; }

/* ---- Callout / Note Accent ---- */
/* Gold left-border stripe: callback to creel basket in the hex sticker */
.callout,
div.bs-callout,
.alert-note,
.alert-info {
  border-left: 4px solid #F39C12;
}

/* ---- Typography Overrides ---- */
h1, h2, h3, h4, h5, h6 {
  color: #1f5e80;
}

h1, h2 {
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* =============================================================
   REDESIGN ADDITIONS
   ============================================================= */

/* ---- Survey Type Cards ---- */
.tc-survey-card {
  border-top: 3px solid #f47d65;
  background: transparent;
  border-radius: 0.375rem;
  padding: 1.25rem;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.tc-survey-card:hover {
  box-shadow: 0 4px 16px rgba(11, 59, 94, 0.18);
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .tc-survey-card {
    transition: none;
  }
  .tc-survey-card:hover {
    transform: none;
  }
}

.tc-card-type {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5a6268;
  margin-bottom: 0.35rem;
}

.tc-card-link {
  color: #b83d29;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
}

.tc-card-link:hover,
.tc-card-link:focus {
  color: #8c2d1e;
  text-decoration: underline;
}

/* ---- Focus ring ---- */
:focus-visible {
  outline: 2px solid #f47d65;
  outline-offset: 3px;
}

/* ---- Smooth scroll (reduced-motion safe) ---- */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

/* ---- Badge Block ---- */
/* pkgdown extracts badges from the sentinel block and places them in the sidebar */
.sidebar .badge-block img,
.sidebar p img[alt*="badge"],
.sidebar p img[src*="shields.io"],
.sidebar p img[src*="github.com/chrischizinski"] {
  display: inline-block;
  margin: 2px 2px 2px 0;
}

/* ---- Home Page Spacing ---- */
/* Breathing room above first section heading on the home page */
.template-home main > h2:first-of-type,
.template-home main > h3:first-of-type {
  margin-top: 1.5rem;
}