/* publications.barandiaran.net — matches xabier.barandiaran.net (WordPress "Libre" theme) */

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --text: #404040;
  --text-light: #6b6b6b;
  --bg: #ffffff;
  --accent: #800000;
  --accent-light: #f4e9e9;
  --border: #e2dede;
  --serif: 'Libre Baskerville', Georgia, 'Times New Roman', Times, serif;
}

*, *:before, *:after{ box-sizing: border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.75;
  word-wrap: break-word;
}

a{ color: var(--accent); text-decoration: none; border-bottom: 1px solid transparent; transition: 0.2s; }
a:hover, a:focus{ border-bottom-color: var(--accent); }

.skip-link{
  position:absolute; left:-999px; top:0; background:#fff; color:var(--text);
  padding: .5em 1em; z-index: 1000;
}
.skip-link:focus{ left: 1em; top: 1em; }

.site{ max-width: 62em; margin: 0 auto; padding: 0 1.75em; }

/* header */
.site-header{
  padding: 3.5em 0 2em;
  border-bottom: 1px solid var(--border);
  margin-bottom: 2.5em;
}
.site-branding{ display:flex; align-items:center; gap: 1.25em; flex-wrap: wrap; }
.site-logo{ width: 64px; height: 64px; flex-shrink:0; }
.site-title{ font-size: 1.8125rem; line-height:1.3; margin:0; font-weight: bold; }
.site-title a{ color: var(--text); border-bottom:none; }
.site-title a:hover{ color: var(--accent); }
.site-description{ margin: .25em 0 0; font-style: italic; color: var(--text-light); font-size: 1.0625rem; }
.site-backlink{ margin-top: 1em; font-size: .9375rem; }
.site-updated-top{ margin: .5em 0 0; font-size: .8125rem; color: var(--text-light); font-style: italic; }

/* intro */
.intro{
  font-size: 1.0625rem;
  color: var(--text);
  margin-bottom: 2.5em;
}
.intro p{ margin: 0 0 1em; }
.intro .stat{ font-weight: bold; color: var(--accent); }

/* controls */
.controls{
  display:flex; flex-wrap: wrap; gap: .6em;
  align-items: center;
  margin-bottom: 2.5em;
  padding-bottom: 1.5em;
  border-bottom: 1px solid var(--border);
}
.controls input[type="search"]{
  font-family: var(--serif);
  font-size: 1rem;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: .5em .75em;
  flex: 1 1 220px;
  min-width: 180px;
  background: #fff;
}
.controls input[type="search"]:focus{ outline: 2px solid var(--accent); outline-offset: 1px; }

/* search box + clear (×) button */
.search-wrap{ position: relative; display: flex; flex: 1 1 220px; min-width: 180px; }
.search-wrap input[type="search"]{ flex: 1 1 auto; min-width: 0; padding-right: 2em; }
/* hide the browser's native clear control so ours is the only one */
.search-wrap input[type="search"]::-webkit-search-cancel-button{ -webkit-appearance: none; appearance: none; }
.clear-search{
  position: absolute; right: .35em; top: 50%; transform: translateY(-50%);
  border: none; background: transparent;
  color: var(--text-light); font-family: var(--serif);
  font-size: 1.3rem; line-height: 1; cursor: pointer;
  padding: 0 .3em; border-radius: 3px;
}
.clear-search:hover, .clear-search:focus{ color: var(--accent); outline: none; }

.type-filter{
  display:inline-block;
  font-family: var(--serif);
  font-size: .875rem;
  color: var(--text);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: .35em .9em;
  cursor: pointer;
  transition: 0.15s;
}
.type-filter[aria-pressed="true"]{ background: var(--accent); color: #fff; border-color: var(--accent); }
.type-filter:hover{ border-color: var(--accent); }
/* sort control (Newest / Most cited) */
.sort-control{ display: inline-flex; align-items: center; gap: .4em; }
.sort-label{ font-size: .8125rem; color: var(--text-light); }
.sort-note{
  font-size: .8125rem; font-style: italic; color: var(--text-light);
  margin: -1em 0 2.5em; padding: .6em .9em;
  background: #fafafa; border-left: 3px solid var(--border);
}

.results-count{ font-size: .875rem; color: var(--text-light); margin-left: auto; }

/* publication list */
.pub-list{ list-style: none; margin: 0; padding: 0; }

.pub-item{
  padding: 1.75em 0;
  border-bottom: 1px solid var(--border);
  scroll-margin-top: 1.5em;
}
.pub-item:first-child{ padding-top: 0; }

/* title — the focal point of each entry */
.pub-title{
  font-size: 1.20rem;
  line-height: 1.28;
  font-weight: 700;
  margin: 0 0 .35em;
  color: var(--text);
  letter-spacing: -0.005em;
}
.pub-title a{ color: inherit; border-bottom: 1px solid transparent; }
.pub-title a:hover, .pub-title a:focus{ color: var(--accent); border-bottom-color: var(--accent); }

.pub-meta{
  display:flex; align-items:center; gap: .6em; flex-wrap: wrap;
  margin-bottom: .55em;
}
.pub-type{
  font-family: var(--serif);
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-light);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: .15em .55em;
  white-space: nowrap;
}
.pub-year{ font-size: .875rem; color: var(--text-light); }
.pub-cited{
  font-size: .8125rem; color: var(--accent);
  background: var(--accent-light); border-radius: 3px;
  padding: .05em .5em; white-space: nowrap; border-bottom: none;
}
a.pub-cited:hover{ background: var(--accent); color: #fff; }
.pub-permalink{ font-size: .8125rem; color: var(--text-light); margin-left: auto; border-bottom: none; }
.pub-permalink:hover{ color: var(--accent); }

/* full reference — demoted to muted secondary text below the title */
.pub-citation{ margin: 0 0 .6em; font-size: .9rem; line-height: 1.6; color: var(--text-light); }
.pub-citation em{ font-style: italic; }
.pub-citation a{ color: var(--text-light); border-bottom-color: rgba(107,107,107,.35); }
.pub-citation a:hover{ color: var(--accent); border-bottom-color: var(--accent); }

.pub-actions{ display:flex; flex-wrap: wrap; gap: .5em; align-items: flex-start; }
/* NO-JS fallback: an open expandable panel takes the full row so it drops below the
   buttons instead of squeezing between them (and stretching siblings vertically) */
.pub-actions > details.pub-details[open]{ flex-basis: 100%; }
.pub-actions > details.pub-details[open] .pub-panel{ width: 100%; }

/* JS-enhanced: panels are relocated into a full-width holder below the button row,
   so every button stays put in one aligned row and the panel drops underneath.
   The triggering button is painted maroon to show which panel is open. */
.js-panels .pub-actions > details.pub-details[open]{ flex-basis: auto; }
.js-panels .pub-details[open] > summary.pub-action-btn{
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.pub-panels{ width: 100%; }
.pub-panels > .pub-panel{ margin-top: .5em; }

.pub-action, .pub-action-btn{
  display:inline-block;
  font-family: var(--serif);
  font-size: .9rem;
  line-height: 1.4;
  color: var(--text-light);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: .3em .7em;
  cursor: pointer;
  text-decoration: none;
  transition: 0.15s;
}
.pub-action:hover, .pub-action-btn:hover{ background: var(--accent-light); color: var(--accent); border-color: var(--accent); }
/* keep summary buttons visually identical to link buttons (no browser default sizing) */
.pub-action-btn{ font-family: var(--serif); font-weight: 400; }
.pub-action[aria-disabled="true"]{ opacity:.5; cursor:default; pointer-events:none; }
.pub-action .soon{ font-size:.8em; font-style:italic; opacity:.75; }
.pub-action-btn::-webkit-details-marker{ display:none; }

.pub-panel{
  margin-top: .875em;
  padding: 1em 1.25em;
  background: #fafafa;
  border-left: 3px solid var(--accent);
  font-size: .9375rem;
  line-height: 1.7;
}
.pub-panel p{ margin: 0; }
.pub-panel .quote{ font-style: italic; }

details.pub-details{ margin-top: 0; }
details.pub-details > summary{ list-style:none; }
details.pub-details > summary::-webkit-details-marker{ display:none; }

/* cite / export panel */
.pub-cite-panel .cite-lead{ margin: 0 0 .6em; font-size: .9375rem; }
.pub-cite-panel .pub-action{ margin-bottom: .4em; }
.pub-cite-panel .cite-note{ margin: .75em 0 0; font-size: .8125rem; color: var(--text-light); font-style: italic; }

/* essential summary panel */
.summary-panel{ max-height: 60vh; overflow-y: auto; }
.summary-panel .summary-meta{ font-style: italic; color: var(--text-light); font-size: .875rem; margin: 0 0 1em; }
.summary-panel h4{ font-size: 1rem; color: var(--accent); margin: 1.25em 0 .4em; }
.summary-panel h4:first-of-type{ margin-top: 0; }
.summary-panel p{ margin: 0 0 .85em; }
/* quotes sit inside the panel's maroon bar, so they carry no bar of their own
   (avoids the doubled red line); a soft maroon tint sets them apart instead */
.summary-quote{
  position: relative;
  margin: .85em 0; padding: .7em 3.5em .7em 1em;
  border: none; border-radius: 3px;
  background: var(--accent-light);
  font-style: italic; font-size: .9rem;
}
.summary-quote cite{ display:block; margin-top: .4em; font-style: normal; font-size: .8rem; color: var(--text-light); }
.copy-quote{
  position: absolute; top: .45em; right: .45em;
  font-family: var(--serif); font-size: .7rem; line-height: 1.3;
  color: var(--text-light); background: #fff;
  border: 1px solid var(--border); border-radius: 3px;
  padding: .12em .5em; cursor: pointer; opacity: .7; transition: .15s;
}
.copy-quote:hover, .copy-quote:focus{ color: var(--accent); border-color: var(--accent); opacity: 1; outline: none; }
.copy-quote.copied{ color: var(--accent); border-color: var(--accent); opacity: 1; }

/* keywords — compact inline metadata line, prefixed with a KEYWORDS: label */
.pub-keywords{ margin: .1em 0 .7em; font-size: .8125rem; color: var(--text-light); line-height: 1.5; }
.pub-kw-label{
  font-size: .7rem; letter-spacing: .06em; text-transform: uppercase;
  font-weight: bold; color: var(--text-light); margin-right: .35em; cursor: help;
}
/* dotted underline signals the terms are clickable filters */
.pub-kw{ color: var(--text-light); border-bottom: 1px dotted #c3bcbc; cursor: pointer; }
.pub-kw:hover{ color: var(--accent); border-bottom: 1px solid var(--accent); }
.pub-kw.active{ color: var(--accent); font-weight: bold; border-bottom: 1px solid var(--accent); }
.pub-kw.active{ color: var(--accent); font-weight: bold; border-bottom-color: var(--accent); }
.kw-sep{ color: #cbc4c4; margin: 0 .1em; }

/* talks panel */
.pub-talks-panel .talk-list{ margin: 0; padding-left: 1.1em; }
.pub-talks-panel .talk-list li{ margin: .4em 0; font-size: .9rem; line-height: 1.5; }
.talk-meta{ color: var(--text-light); font-size: .8rem; }

/* highlighted / featured */
.pub-featured{
  font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; font-weight: bold;
  color: var(--accent); background: var(--accent-light);
  border-radius: 3px; padding: .12em .5em; white-space: nowrap;
}
.type-filter.featured-toggle[aria-pressed="true"]{ background: var(--accent); color: #fff; border-color: var(--accent); }

.no-results{ padding: 3em 0; text-align:center; color: var(--text-light); display:none; }
.no-results.show{ display:block; }

/* footer */
.site-footer{
  font-size: .875rem;
  color: var(--text-light);
  margin: 5em 0 3em;
  padding-top: 1.75em;
  border-top: 1px solid var(--border);
}
.site-footer p{ margin: 0 0 .5em; }
.site-updated{ font-size: .8125rem; color: var(--text-light); font-style: italic; }

@media screen and (max-width: 45em){
  body{ font-size: 16px; }
  .site{ padding: 0 1.25em; }
  .site-header{ padding: 2em 0 1.5em; }
  .site-title{ font-size: 1.5rem; }
  .pub-title{ font-size: 1.25rem; }
  .results-count{ margin-left: 0; width: 100%; }
}

@media print{
  .controls, .pub-actions, .site-footer, .pub-permalink{ display:none; }
  .pub-panel{ display:block !important; border-left: none; padding-left: 0; background: none; }
}