/* ===========================
   Hero image
   =========================== */
.album-hero {
  margin-bottom: 0;
}
.album-hero .hero-img {
  display: block;
  width: 100%;
  height: 50vh;
  object-fit: cover;
  object-position: center center;
}
@media (max-width: 575.98px) {
  .album-hero .hero-img { height: 40vh; }
}

/* ===========================
   Album top section
   =========================== */
.album-top {
  background-color: var(--aghc-beige);
}

.album-top .card {
  background-color: var(--aghc-beige);
  border: 1px solid #dee2e6; /* keep bootstrap’s subtle border */
}

.album-top .table {
  background-color: var(--aghc-beige);
}

.album-top .table th,
.album-top .table td {
  background-color: var(--aghc-beige);
}

/* ===========================
   Image card previews
   =========================== */
.thumb-square-fw {
  width: 100%;
  aspect-ratio: 2 / 1;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.thumb-square-fw-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Rounded corners */
.js-card .js-card-toggle .rounded-start {
  border-top-left-radius: .375rem;
  border-bottom-left-radius: .375rem;
  overflow: hidden;
}
.js-card.open .js-card-toggle .rounded-start {
  border-bottom-left-radius: 0 !important;
}
.js-card:not(.open) .js-card-toggle .rounded-start {
  border-bottom-left-radius: .375rem;
}

/* Card details toggle */
.js-card-details { display: none; border-top: 0 !important; }
.js-card.open > .js-card-details {
  display: block;
  border-top: 1px solid #dee2e6 !important;
}
.card-body-inner { padding: 1rem; }

/* Caret rotation */
.js-card .caret { transition: transform .2s ease; }
.js-card.open .caret { transform: rotate(180deg); }

/* ===========================
   Metadata tables
   =========================== */
.js-meta-table.hide-empty tr.is-empty { display: none; }
.table td, .table th { vertical-align: middle; }
.meta-plain-list { color: inherit; }

/* ===========================
   Export section
   =========================== */
.export-section { margin-top: 2rem; margin-bottom: 3rem; }
.export-section .card {
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  overflow: hidden;
}
.export-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: .75rem 1rem;
  background: #fff;
  border-bottom: 0;
}
.js-export-card.open > .export-header {
  border-bottom: 1px solid #dee2e6;
}
.export-title {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.2;
  margin: 0;
}
.js-export-details { display: none; border-top: 0 !important; }
.js-export-card.open > .js-export-details,
.js-export-details.open {
  display: block;
  border-top: 1px solid #dee2e6 !important;
}
.export-toolbar { margin-bottom: .5rem; }
.export-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table,
.table-bordered > :not(caption) > * > * {
  border-color: rgba(0,0,0,.125);
}
.js-export-card .caret { transition: transform .2s ease; }
.js-export-card.open .caret { transform: rotate(180deg); }

/* Export/metadata buttons */
.export-toolbar .btn,
.js-toggle-empty.btn,
.js-copy-table.btn,
.js-download-csv.btn {
  border: 1px solid var(--aghc-gray);
  color: var(--aghc-gray);
  background-color: transparent;
}
.export-toolbar .btn:hover,
.export-toolbar .btn:focus,
.js-toggle-empty.btn:hover,
.js-toggle-empty.btn:focus,
.js-copy-table.btn:hover,
.js-copy-table.btn:focus,
.js-download-csv.btn:hover,
.js-download-csv.btn:focus {
  background-color: var(--aghc-gray);
  color: #fff;
}

/* ===========================
   Search input group
   =========================== */
.input-group.input-group-sm .input-group-text {
  border: 1px solid var(--aghc-gray);
  border-right: 1px solid var(--aghc-gray);
  color: #808080;
  background-color: transparent;
}
.input-group.input-group-sm .form-control {
  border: 1px solid var(--aghc-gray);
  border-left: none;
  color: var(--aghc-gray);
  background-color: transparent;
}
.input-group.input-group-sm .form-control:focus {
  background-color: transparent;
  color: var(--aghc-gray);
  box-shadow: none;
  border-color: var(--aghc-gray);
}

/* ===========================
   Lightbox
   =========================== */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1050;
}
.lightbox[hidden] { display: none !important; }
.lightbox-frame {
  max-width: 95%;
  max-height: 95%;
  text-align: center;
}
.lightbox-img { max-width: 100%; max-height: 80vh; border-radius: 0; }
.lightbox-caption { margin-top: .5rem; }
.lightbox-close {
  position: absolute;
  top: 1rem; right: 1rem;
  z-index: 1060;
  background: rgba(0,0,0,.5);
  color: #fff;
  border: none;
  font-size: 1.5rem;
  line-height: 1;
  padding: .25rem .5rem;
  border-radius: .25rem;
  cursor: pointer;
}
