/* CHM Library catalogue. Everything is scoped to .chm-cat so it can't disturb the rest of the page;
   fonts and link colours are inherited from the Warwick template. 
  CSS generated using Claude Code (Opus 5.5)*/
.chm-cat { --chm-line: #d9d9d9; --chm-muted: #5c5c5c; --chm-tag: #f1f1f1; --chm-accent: #3a6898; margin: 1em 0 2em; }

.chm-cat__controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75em 1em; margin-bottom: 1em; }
.chm-cat__search { grid-column: 1 / -1; }
.chm-cat__label { display: block; font-weight: 600; font-size: .9em; margin-bottom: .25em; }
.chm-cat .form-control { width: 100%; box-sizing: border-box; min-height: 2.4em; padding: .35em .6em; font: inherit; border: 1px solid #b3b3b3; border-radius: 3px; background: #fff; }
.chm-cat input[type="search"].form-control { font-size: 1.1em; }
.chm-cat .form-control:focus { outline: 2px solid var(--chm-accent); outline-offset: 1px; }

.chm-cat__status { color: var(--chm-muted); font-size: .95em; padding: .5em 0; border-bottom: 2px solid var(--chm-line); }
.chm-cat__reset { background: none; border: 0; padding: 0; font: inherit; color: var(--chm-accent); text-decoration: underline; cursor: pointer; }

.chm-cat__list { list-style: none; margin: 0; padding: 0; }
.chm-cat__item { border-bottom: 1px solid var(--chm-line); }
.chm-cat__item summary { display: block; cursor: pointer; padding: .7em 1.6em .7em 0; position: relative; list-style: none; }
.chm-cat__item summary::-webkit-details-marker { display: none; }
.chm-cat__item summary::after { content: "+"; position: absolute; right: .3em; top: .55em; font-size: 1.2em; color: var(--chm-muted); }
.chm-cat__item details[open] summary::after { content: "–"; }
.chm-cat__item summary:hover .chm-cat__title { text-decoration: underline; }
.chm-cat__item summary:focus-visible { outline: 2px solid var(--chm-accent); outline-offset: 2px; }
.chm-cat__title { display: block; font-weight: 600; color: var(--chm-accent); }
.chm-cat__byline { display: block; color: var(--chm-muted); font-size: .95em; margin-top: .1em; }
.chm-cat__tags { display: flex; flex-wrap: wrap; gap: .35em; margin-top: .35em; }
.chm-cat__tag { font-size: .8em; background: var(--chm-tag); border-radius: 3px; padding: .1em .5em; }
.chm-cat__tag--missing { background: #fbe3e3; color: #8a1f1f; }

.chm-cat__details { display: grid; grid-template-columns: max-content 1fr; gap: .25em 1.2em; margin: 0 0 .9em; padding: .7em .9em; background: #f7f7f7; border-radius: 3px; font-size: .95em; }
.chm-cat__details dt { font-weight: 600; margin: 0; }
.chm-cat__details dd { margin: 0; }

.chm-cat__pager { display: flex; flex-wrap: wrap; gap: .35em; align-items: center; margin-top: 1.2em; }
.chm-cat__page { min-width: 2.4em; padding: .3em .7em; border: 1px solid #b3b3b3; border-radius: 3px; background: #fff; font: inherit; cursor: pointer; }
.chm-cat__page.is-current { background: var(--chm-accent); border-color: var(--chm-accent); color: #fff; }
.chm-cat__gap { padding: 0 .2em; color: var(--chm-muted); }
.chm-cat__empty { padding: 1em; background: #fbe3e3; }

@media (max-width: 700px) {
  .chm-cat__controls { grid-template-columns: 1fr 1fr; }
  .chm-cat__details { grid-template-columns: 1fr; }
  .chm-cat__details dd { margin-bottom: .4em; }
}