/* Exhibits tab styles — inherits tokens from styles.css */

/* ===== Visibility toggles (must be unlayered to override @layer rules) ===== */
.main.exhibits-mode .day-switcher,
.main.exhibits-mode #venue-filters,
.main.exhibits-mode .board-venues,
.main.exhibits-mode .board-scroll,
.main.exhibits-mode .all-days-list,
.main.exhibits-mode .board-footer,
.main.exhibits-mode #count-bar {
  display: none;
}

.main:not(.exhibits-mode) .exhibits-directory {
  display: none;
}

/* ===== Category color tokens ===== */
:root {
  --cat-green:     light-dark(hsl(160 60% 38%), hsl(160 84% 45%));
  --cat-green-bg:  light-dark(hsl(160 60% 38% / 0.10), hsl(160 84% 45% / 0.15));
  --cat-amber:     light-dark(hsl(38 92% 44%), hsl(44 92% 56%));
  --cat-amber-bg:  light-dark(hsl(38 92% 44% / 0.10), hsl(44 92% 56% / 0.15));
  --cat-rose:      light-dark(hsl(350 80% 55%), hsl(350 90% 70%));
  --cat-rose-bg:   light-dark(hsl(350 80% 55% / 0.10), hsl(350 90% 70% / 0.15));
  --cat-purple:    light-dark(hsl(270 60% 55%), hsl(270 95% 80%));
  --cat-purple-bg: light-dark(hsl(270 60% 55% / 0.10), hsl(270 95% 80% / 0.15));
  --cat-blue:      light-dark(hsl(217 70% 55%), hsl(213 94% 70%));
  --cat-blue-bg:   light-dark(hsl(217 70% 55% / 0.10), hsl(213 94% 70% / 0.15));
  --cat-cyan:      light-dark(hsl(185 70% 42%), hsl(185 80% 55%));
  --cat-cyan-bg:   light-dark(hsl(185 70% 42% / 0.10), hsl(185 80% 55% / 0.15));
  --cat-orange:    light-dark(hsl(24 80% 50%), hsl(24 90% 62%));
  --cat-orange-bg: light-dark(hsl(24 80% 50% / 0.10), hsl(24 90% 62% / 0.15));
}

/* ===== Section Tabs: Sessions | Exhibits ===== */
.section-tabs {
  display: flex;
  gap: 2px;
  background: var(--bg-input);
  border-radius: var(--radius);
  padding: 3px;
  margin-bottom: 8px;
}

.section-tab {
  flex: 1;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 7px 12px;
  border-radius: 6px;
  border: none;
  background: transparent;
  color: var(--text-dim);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.section-tab.active {
  background: var(--accent);
  color: white;
}

/* ===== Exhibits Directory Layout ===== */
.exhibits-directory {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

/* ===== Alpha Nav Strip ===== */
.alpha-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 6px var(--pad-x);
  flex-shrink: 0;
}

.alpha-letter {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  font-weight: 600;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  border: none;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  opacity: 0.25;
}

.alpha-letter.has-items {
  color: var(--text-dim);
  background: var(--bg-input);
  opacity: 1;
}

.alpha-letter.has-items:hover {
  background: var(--bg-hover);
  color: var(--text);
}

.alpha-letter:disabled {
  cursor: default;
}

/* ===== Exhibits Filters ===== */
.exhibits-filters {
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  mask-image: linear-gradient(to right, black calc(100% - 32px), transparent);
  -webkit-mask-image: linear-gradient(to right, black calc(100% - 32px), transparent);
  padding: 4px var(--pad-x) 6px;
  flex-shrink: 0;
}

.exhibits-filters::-webkit-scrollbar { display: none; }

/* Reuses .filter-btn from styles.css for pills */

/* Separator between category and hall pills */
.filter-sep {
  width: 1px;
  background: var(--border);
  flex-shrink: 0;
  margin: 4px 2px;
}

/* ===== Exhibits Count Bar ===== */
.exhibits-count-bar {
  padding: 6px var(--pad-x);
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  flex-shrink: 0;
}

.exhibits-count-bar .highlight {
  color: var(--accent);
}

/* ===== Exhibits List ===== */
.exhibits-list {
  flex: 1;
  overflow-y: auto;
  padding: 0 0 8px;
}

/* ===== Letter Group Headers (sticky, like date-group-header) ===== */
.letter-group-header {
  padding: 10px var(--pad-x) 5px;
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--text);
  display: flex;
  align-items: baseline;
  gap: 8px;
  position: sticky;
  top: 0;
  background: var(--bg);
  z-index: 2;
}

.letter-group-header::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, var(--border), transparent);
}

.letter-group-count {
  font-family: var(--font-mono);
  font-size: 0.55rem;
  color: var(--text-muted);
  font-weight: 400;
}

/* ===== Exhibitor Row ===== */
.exhibitor-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px var(--pad-x);
  cursor: pointer;
  transition: background 0.15s;
  content-visibility: auto;
  contain-intrinsic-size: auto 36px;
}

.exhibitor-row:hover {
  background: var(--bg-hover);
}

.exhibitor-name {
  font-size: 0.82rem;
  font-weight: 400;
  color: var(--text);
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

/* ===== Hall Badge ===== */
.hall-badge {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--bg-input);
  border: 1px solid var(--border);
  color: var(--text-dim);
  white-space: nowrap;
  flex-shrink: 0;
}

.hall-badge .hall-label {
  color: var(--text-muted);
  font-weight: 400;
}

/* ===== Stall Badge ===== */
.stall-badge {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  color: var(--text-dim);
  background: var(--bg-input);
  padding: 2px 7px;
  border-radius: 4px;
  border: 1px solid var(--border);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ===== Category Tags ===== */
.cat-tag {
  font-family: var(--font-mono);
  font-size: 0.55rem;
  letter-spacing: 0.03em;
  padding: 2px 7px;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}

.cat-tag.cat-startup  { background: var(--cat-green-bg);  color: var(--cat-green); }
.cat-tag.cat-corp     { background: light-dark(hsl(239 84% 64% / 0.10), hsl(239 84% 64% / 0.15)); color: var(--accent); }
.cat-tag.cat-govt     { background: var(--cat-amber-bg);  color: var(--cat-amber); }
.cat-tag.cat-intl     { background: var(--cat-rose-bg);   color: var(--cat-rose); }
.cat-tag.cat-acad     { background: var(--cat-purple-bg); color: var(--cat-purple); }
.cat-tag.cat-psu      { background: var(--cat-blue-bg);   color: var(--cat-blue); }
.cat-tag.cat-country  { background: var(--cat-cyan-bg);   color: var(--cat-cyan); }
.cat-tag.cat-npo      { background: var(--cat-orange-bg); color: var(--cat-orange); }

/* ===== No results ===== */
.exhibits-empty {
  padding: 40px var(--pad-x);
  text-align: center;
  color: var(--text-muted);
  font-size: 0.85rem;
}

/* ===== Detail panel exhibitor-specific ===== */
.detail-nearby-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 4px;
}

.detail-nearby-item {
  font-size: 0.8rem;
  color: var(--text-dim);
  padding: 4px 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.detail-nearby-item .stall-badge {
  font-size: 0.52rem;
}

/* ===== Desktop ===== */
@media (min-width: 768px) {
  .exhibits-filters {
    flex-wrap: wrap;
    overflow-x: visible;
    mask-image: none;
    -webkit-mask-image: none;
  }

  .exhibitor-name {
    font-size: 0.85rem;
  }

  .alpha-nav {
    gap: 3px;
  }

  .alpha-letter {
    width: 24px;
    height: 24px;
    font-size: 0.6rem;
  }
}