/*padding: 10px;*/

  .article-content {
  white-space: pre-line;
}

/* Keep catalog covers inside a stable ratio frame so lazy-loading images do not shift nearby cards during scroll. */
.catalog-cover-frame {
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background-color: #f8f9fa;
}

/* Ensure each cover fills the reserved frame consistently while preserving visual quality. */
.catalog-cover-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Render tag chips in a wrapping inline row so librarians can scan many tags quickly without stacked list rows. */
.book-tag-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

/* Keep only spacing/flow behavior on the custom class because visual chrome now comes from Bootstrap badge utilities. */
.book-tag-chip {
  gap: 0.1rem;
}

/* Keep tag text legible while letting Bootstrap define core size/weight so badges align with the rest of the admin UI. */
.book-tag-chip-text {
  font-size: 0.85rem;
}

/* Keep remove controls visually compact and vertically centered inside light badges across browsers. */
.book-tag-chip-remove {
  line-height: 1;
}

/*
   Add a reusable red halo for tag-add buttons so librarians receive an immediate visual cue
   after typing pending tag text.  The class is intentionally opt-in and JavaScript-controlled: an
   always-on glow would compete with normal Bootstrap button states, while a state class lets book
   and bin editors share one affordance without changing their submit/fetch behavior.  If the class
   name changes, update both tag editor scripts because otherwise staff may type tags that remain
   visually easy to forget before saving.
*/
.tag-add-button-halo {
  border-color: #dc3545 !important;
  color: #dc3545 !important;
  box-shadow: 0 0 0.35rem rgba(220, 53, 69, 0.85), 0 0 1rem rgba(220, 53, 69, 0.65);
  animation: tag-add-button-halo-pulse 1.2s ease-in-out infinite;
}

/*
   Pulse only the shadow, not layout-affecting properties, so the prompt is noticeable without
   shifting adjacent input-group controls or causing a distracting reflow in dense admin forms.
*/
@keyframes tag-add-button-halo-pulse {
  0%, 100% {
    box-shadow: 0 0 0.25rem rgba(220, 53, 69, 0.75), 0 0 0.8rem rgba(220, 53, 69, 0.55);
  }
  50% {
    box-shadow: 0 0 0.55rem rgba(220, 53, 69, 1), 0 0 1.4rem rgba(220, 53, 69, 0.8);
  }
}

.support-article-image {
    background-color: #f3f3f3;   /* light gray haze */
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    text-align: center;
}

.support-article-image img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

/* Highlight already-printed barcode rows with a subtle gray background so staff can quickly differentiate historical
   print activity without relying solely on badge text. */
tr.barcode-row-printed > td {
    background-color: #eceff1;
    color: #1f2933;
}

/* Keep links and icons readable inside highlighted rows by forcing a high-contrast dark foreground color. */
tr.barcode-row-printed > td a,
tr.barcode-row-printed > td .text-muted,
tr.barcode-row-printed > td .btn,
tr.barcode-row-printed > td .badge {
    color: #1f2933 !important;
}

/* Explicitly preserve default table styling on unprinted rows so they remain visually distinct from printed rows. */
tr.barcode-row-unprinted > td {
    background-color: inherit;
}