/* atac_imagedb – component styles. Bootstrap custom properties only; theme tweaks go to atac_an/_atac_content.scss */

/* cards */
.atac-imagedb .imagedb-card .card-img-top,
.atac-imagedb .imagedb-card .imagedb-noimage {
  aspect-ratio: 4 / 3;
  object-fit: contain;
  width: 100%;
  height: auto; /* 0.8.4: f:image writes width/height attributes – an explicit height would beat aspect-ratio */
  background: var(--bs-tertiary-bg);
  padding: .5rem;
}
.atac-imagedb .imagedb-card .imagedb-facts code {
  font-size: .8em;
  word-break: break-word;
}

/* lightbox (0.8.4): light overlay, no description */
.glightbox-container .goverlay.goverlay {
  background: var(--bs-light, #f4f4f4);
}
.glightbox-container .gslide-description {
  display: none;
}
.glightbox-container .gslide-image img {
  background: var(--bs-light, #f4f4f4);
}

/* toolbar (0.8.4): sticky. < lg: below the fixed navbar (A); >= lg: inside the empty middle of the navbar (B).
   --imagedb-nav-h / --imagedb-toolbar-h are measured by imagedb.js (fallbacks below). */
.atac-imagedb .imagedb-toolbar {
  position: sticky;
  top: var(--imagedb-nav-h, 81px); /* 0.8.5: flush with the navbar, no gap */
  z-index: 1031; /* above .fixed-top (1030), below offcanvas (1045) */
  background: var(--bs-body-bg);
  padding: .5rem 0;
}
@media (min-width: 992px) {
  .atac-imagedb .imagedb-toolbar {
    top: calc((var(--imagedb-nav-h, 60px) - var(--imagedb-toolbar-h, 38px)) / 2);
    background: transparent;
    padding: 0;
  }
}
.atac-imagedb .imagedb-card.is-archived {
  border-color: var(--bs-danger);
}
.atac-imagedb .imagedb-badge-archive {
  /* 0.8.5: centred over the thumbnail, clicks pass through to the lightbox link */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--bs-danger);
  font-size: .9rem;
  pointer-events: none;
  z-index: 1;
}
.atac-imagedb .imagedb-info summary {
  cursor: pointer;
  color: var(--bs-primary);
}

/* watchlist (D14: offcanvas drawer on the right) */
.atac-imagedb .imagedb-wl-drawer {
  --bs-offcanvas-width: 440px;
}
.atac-imagedb .imagedb-wl-drawer.is-busy .offcanvas-body {
  opacity: .6;
  pointer-events: none;
}
.atac-imagedb .imagedb-wl-notice:not(:empty) {
  padding: 1rem 1rem 0;
}
.atac-imagedb .imagedb-wl-thumb {
  width: 96px;
  height: 72px;
  object-fit: contain;
  background: var(--bs-tertiary-bg);
  padding: .25rem;
}
.atac-imagedb .min-width-0 {
  min-width: 0;
}
.atac-imagedb .imagedb-wl-items > li:last-child {
  border-bottom: 0 !important;
}
.atac-imagedb .imagedb-wl-footer {
  background: var(--bs-body-bg);
}
.atac-imagedb .imagedb-wl-count.is-pulse {
  animation: imagedb-pulse .4s ease-out;
}
@keyframes imagedb-pulse {
  0% { transform: scale(1.4); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .atac-imagedb .imagedb-wl-count.is-pulse { animation: none; }
}

/* category menu (0.8.5: list look like a mobile menu – full width, separators, defined toggle buttons) */
.atac-imagedb .imagedb-catmenu {
  width: 100%; /* .offcanvas-lg makes its body display:flex on >= lg – without this the nav shrinks to text width */
  font-size: .95rem;
  line-height: 1.3;
}
.atac-imagedb .imagedb-catmenu ul {
  margin: 0;
}
.atac-imagedb .imagedb-catmenu-level-0 {
  border-top: 1px solid var(--bs-border-color);
}
.atac-imagedb .imagedb-catmenu-level-0 > li {
  border-bottom: 1px solid var(--bs-border-color);
}
.atac-imagedb .imagedb-catlink {
  display: block;
  padding: .5rem .25rem;
  text-decoration: none;
  color: var(--bs-body-color);
}
/* 0.8.6/0.8.7: row states – hover = light primary tint, is-open (on the path) = primary text, is-active (selected) = inverted row incl. toggle */
.atac-imagedb .imagedb-catrow.is-open .imagedb-catlink {
  color: var(--bs-primary);
}
.atac-imagedb .imagedb-catrow:hover {
  background: var(--bs-primary-bg-subtle);
}
.atac-imagedb .imagedb-catrow:hover .imagedb-catlink,
.atac-imagedb .imagedb-catrow:hover .imagedb-cattoggle {
  color: var(--bs-primary);
}
.atac-imagedb .imagedb-catrow.is-active {
  background: var(--bs-primary);
}
.atac-imagedb .imagedb-catrow.is-active .imagedb-catlink,
.atac-imagedb .imagedb-catrow.is-active .imagedb-cattoggle {
  color: #fff;
}
.atac-imagedb .imagedb-catrow.is-active .imagedb-cattoggle {
  border-left-color: rgba(255, 255, 255, .4);
}
.atac-imagedb .imagedb-catrow.is-active .imagedb-cattoggle:hover,
.atac-imagedb .imagedb-catrow.is-active .imagedb-cattoggle:focus-visible {
  background: rgba(255, 255, 255, .15);
  color: #fff;
}
.atac-imagedb .imagedb-catmenu-level-1 {
  background: transparent;
  padding: .25rem 0 .25rem .75rem;
}
.atac-imagedb .imagedb-catmenu-level-1 .imagedb-catlink {
  padding: .3rem .25rem;
  font-size: .9rem;
}
.atac-imagedb .imagedb-cattoggle {
  flex: 0 0 2.5rem;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-left: 1px solid var(--bs-border-color);
  background: transparent;
  color: var(--bs-secondary-color);
  padding: 0;
}
.atac-imagedb .imagedb-cattoggle:hover,
.atac-imagedb .imagedb-cattoggle:focus-visible {
  color: var(--bs-primary);
  background: var(--bs-tertiary-bg);
}
.atac-imagedb .imagedb-chevron {
  display: inline-block;
  width: .65em;
  height: .65em;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  transform: translateY(-.15em) rotate(45deg);
  transition: transform .15s ease-in-out;
}
.atac-imagedb .imagedb-cattoggle.collapsed .imagedb-chevron {
  transform: translateX(-.1em) rotate(-45deg);
}
@media (prefers-reduced-motion: reduce) {
  .atac-imagedb .imagedb-chevron { transition: none; }
}

/* 0.8.11 (D23): card footer buttons – no caret, no wrap, 1em icon slot; watchlist state = check + tint */
.atac-imagedb .imagedb-card .card-footer .btn {
  white-space: nowrap;
}
.atac-imagedb .imagedb-btn-icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  margin-right: 0.35em;
}
.atac-imagedb .imagedb-wl-toggle .imagedb-icon-check,
.atac-imagedb .imagedb-wl-toggle .imagedb-wl-sr {
  display: none;
}
.atac-imagedb .imagedb-wl-toggle.is-active .imagedb-icon-plus {
  display: none;
}
.atac-imagedb .imagedb-wl-toggle.is-active .imagedb-icon-check {
  display: inline-block;
  color: var(--bs-secondary);
}
.atac-imagedb .imagedb-wl-toggle.is-active .imagedb-wl-sr {
  display: inline;
}
.atac-imagedb .imagedb-wl-toggle.is-active {
  background-color: var(--bs-secondary-bg-subtle);
  border-color: var(--bs-secondary);
}
.atac-imagedb .imagedb-wl-toggle.is-active:hover,
.atac-imagedb .imagedb-wl-toggle.is-active:focus-visible,
.atac-imagedb .imagedb-wl-toggle.is-active.show {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}
.atac-imagedb .imagedb-wl-toggle.is-active:hover .imagedb-icon-check,
.atac-imagedb .imagedb-wl-toggle.is-active:focus-visible .imagedb-icon-check,
.atac-imagedb .imagedb-wl-toggle.is-active.show .imagedb-icon-check {
  color: #fff;
}

/* 0.8.12: footer buttons share the width (even pair; full line each if the card is too narrow) */
.atac-imagedb .imagedb-card .card-footer > .dropdown {
  flex: 1 1 auto;
}
.atac-imagedb .imagedb-card .card-footer > .dropdown > .btn {
  width: 100%;
}

/* 0.8.13: category toggle in the toolbar (< lg), icon only */
.atac-imagedb .imagedb-cat-toggle .imagedb-btn-icon {
  margin-right: 0;
  width: 1.25em;
  height: 1.25em;
  position: relative;
  top: 2px; /* optically centred in the 38 px button (measured) */
}