/*
 * Responsive CSS overrides for alexpacini.com
 * Uses clamp() for fluid typography that scales with viewport width.
 * Import AFTER base CSS (markDown.css or markDownMono.css).
 */

/* Modern CSS reset: include padding/border in width calculations */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Page title (used on index.html) */
h1#AlexPacini {
  font-size: clamp(2rem, 8vw, 48pt);
  margin-bottom: clamp(1rem, 4vw, 30pt);
}

/* Section headings (index.html menu items, pubs.html section titles) */
h2 {
  font-size: clamp(1.5rem, 5vw, 32pt);
}

/* Header styles (pubs.html page header) */
h1.header {
  margin-left: clamp(-3%, -2vw, 0%);
  font-size: clamp(2rem, 6vw, 42pt);
  margin-bottom: 0;
}

h2.header {
  margin-left: 0;
  margin-bottom: clamp(1rem, 3vw, 5%);
  font-size: clamp(1rem, 2.5vw, 1.25rem);
}

/* Section headings within publications */
#publications h1 {
  margin-left: 2%;
  font-size: clamp(1.5rem, 4vw, 32pt);
}

#publications p {
  text-align: justify;
  margin-bottom: 0.3rem;
  overflow-wrap: break-word;   /* break long words at container edge */
  hyphens: auto;               /* browser-native hyphenation (uses lang attribute) */
}

div.section {
  margin-bottom: 1.5rem;
  scroll-margin-top: 1rem;  /* Offset for anchor links */
}

/* Section heading anchor links */
div.section h1 a:hover::after {
  content: ' #';
  color: #999;
  font-size: 0.7em;
}

/* BibTeX copy button - styled to match links */
/* [bib] copy button: floats right within paragraph text.
   Float is the correct tool for elements within flowing text. */
.bib-copy-btn {
  float: right;
  margin-left: 1em;
  padding: 0;
  font-size: 0.85em;
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: transparent;
  color: #1a5b9c;
  text-decoration: none;
  transition: color 0.15s ease;
}

.bib-copy-btn:hover {
  color: #0d3d6e;
  text-decoration: underline;
}

/* Loading/error states */
#loading {
  text-align: center;
  padding: 2.5rem;
  color: #666;
  font-style: italic;
}

#error {
  color: #c00;
  padding: 1.25rem;
  display: none;
}

/* Icon row spacing (index.html social links) */
h2:last-of-type {
  margin-top: clamp(1rem, 3vw, 24px);
}