/* TCG Bot v2: small additions on top of Bootstrap 5. */
:root { --tcg-purple: #7c5cff; --tcg-pink: #d63384; }

/* Status badges that Bootstrap has no theme colour for */
.badge.status-in_store_only { background: var(--tcg-purple); color: #fff; }
.badge.status-notify_me { background: var(--tcg-pink); color: #fff; }
.badge.status-error { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); border: 1px solid var(--bs-danger-border-subtle); }
.badge.status { text-transform: capitalize; font-weight: 600; white-space: nowrap; }

/* History strip (last N checks) */
.spark { display: inline-flex; gap: 1px; height: 14px; align-items: flex-end; vertical-align: middle; }
.spark i { display: block; width: 5px; height: 14px; border-radius: 1px; background: var(--bs-secondary); opacity: .85; }
.spark i.preorder { background: var(--bs-primary); } .spark i.in_stock { background: var(--bs-success); } .spark i.in_store_only { background: var(--tcg-purple); }
.spark i.out_of_stock { background: var(--bs-danger); } .spark i.coming_soon { background: var(--bs-warning); } .spark i.notify_me { background: var(--tcg-pink); } .spark i.error { background: #733; }

/* Product thumbs and cards */
.product-thumb { width: 96px; height: 96px; object-fit: contain; border-radius: .5rem; background: var(--bs-tertiary-bg); flex: 0 0 auto; }
.product-thumb.placeholder-thumb { display: flex; align-items: center; justify-content: center; color: var(--bs-secondary-color); font-size: 2rem; }
.product-card .table { margin-bottom: 0; }
.product-card .card-footer { background: transparent; }
.price { font-variant-numeric: tabular-nums; }

/* Release grid (level 1) */
.release-card { transition: border-color .15s; }
.release-card:hover { border-color: var(--bs-primary); }
.release-logo-wrap { height: 120px; display: flex; align-items: center; justify-content: center; background: var(--bs-tertiary-bg); border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0; padding: .75rem; }
.release-logo { max-height: 100%; max-width: 100%; object-fit: contain; }
.release-tile { font-weight: 700; font-size: 1.25rem; text-align: center; color: var(--bs-secondary-color); }

/* Release calendar strip */
.calendar-strip { display: flex; gap: .75rem; overflow-x: auto; padding-bottom: .5rem; scroll-snap-type: x proximity; }
.calendar-strip > * { flex: 0 0 auto; width: 15rem; scroll-snap-align: start; }
.calendar-strip .card.past { opacity: .6; }
.calendar-strip .card.today { border-color: var(--bs-warning); }
.calendar-items { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Price history bars */
.price-bar { height: 10px; border-radius: 3px; background: var(--bs-primary); opacity: .7; min-width: 2px; }

/* Offers: table on wide screens, stacked cards on phones (< 576px) */
.offer-cards { display: none; }
@media (max-width: 575.98px) {
  .offer-table { display: none; }
  .offer-cards { display: block; }
}
.offer-cards .list-group-item { padding: .75rem; }

/* Timeline (Upcoming) */
.timeline-head { position: sticky; top: 56px; z-index: 1; }

/* Events */
.event-row { display: grid; grid-template-columns: 9.5rem 6.5rem 1fr; gap: .75rem; padding: .35rem 0; border-bottom: 1px solid var(--bs-border-color-translucent); font-size: .875rem; }
.event-row.warn { color: var(--bs-warning-text-emphasis); } .event-row.error { color: var(--bs-danger-text-emphasis); } .event-row.debug { color: var(--bs-secondary-color); }
@media (max-width: 700px) { .event-row { grid-template-columns: 1fr; gap: .1rem; } }

/* Search */
#searchMenu .dropdown-item { white-space: normal; }
#searchMenu .dropdown-item > span { min-width: 0; }

/* Tables that get wide: scroll horizontally instead of breaking the page */
.table-scroll { overflow-x: auto; }
tr.inactive > td { opacity: .45; }
.truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mono { font-family: var(--bs-font-monospace); font-size: .8em; }
.w-min { width: 1%; white-space: nowrap; }
.filter-bar .form-select, .filter-bar .form-control { min-width: 9rem; }
.cursor-pointer { cursor: pointer; }

/* Touch: 44px targets for the things you tap on a phone */
@media (pointer: coarse) {
  .btn-sm:not(.btn-link) { min-height: 44px; display: inline-flex; align-items: center; }
  .nav-link, .list-group-item-action, .form-select-sm, .form-control-sm { min-height: 44px; }
  .btn-group-sm > .btn { min-height: 44px; }
}