/* ============================================================
   HUNT RECAP CARD - Orbit164
   All classes prefixed .orbit-recap-* to avoid global conflicts.
   ============================================================ */

/* ── Rarity color tokens ───────────────────────────────────── */
.orbit-recap-rarity-common    { --recap-color: #C0C0D8; --recap-border: #C0C0D830; --recap-glow: #C0C0D815; }
.orbit-recap-rarity-rare      { --recap-color: #9B59B6; --recap-border: #9B59B650; --recap-glow: #9B59B618; }
.orbit-recap-rarity-epic      { --recap-color: #4D8FFF; --recap-border: #4D8FFF50; --recap-glow: #4D8FFF18; }
.orbit-recap-rarity-legendary { --recap-color: #00C853; --recap-border: #00C85350; --recap-glow: #00C85318; }
.orbit-recap-rarity-mythic    { --recap-color: #FFD700; --recap-border: #FFD70070; --recap-glow: #FFD70020; }

/* ── Inline preview shown on the results screen ────────────── */
.orbit-recap-card-preview {
  margin: 0 16px 16px;
  border-radius: 16px;
  overflow: hidden;
  border: 2px solid var(--recap-border, #C0C0D830);
  background: linear-gradient(135deg, #15161C 0%, var(--recap-glow, #15161C) 100%);
  box-shadow: 0 0 24px var(--recap-glow, transparent);
  transition: box-shadow 0.3s ease;
}

.orbit-recap-card-preview-stripe {
  height: 4px;
  background: linear-gradient(90deg, var(--recap-color, #C0C0D8), transparent);
}

.orbit-recap-card-preview-inner {
  padding: 16px;
}

.orbit-recap-card-preview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}

.orbit-recap-card-preview-title {
  font-family: 'Bangers', cursive;
  font-size: 22px;
  letter-spacing: 2px;
  color: var(--recap-color, #C0C0D8);
  line-height: 1.1;
  flex: 1;
  min-width: 0;
}

.orbit-recap-card-preview-rarity-badge {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--recap-color, #C0C0D8);
  background: var(--recap-glow, transparent);
  border: 1px solid var(--recap-border, #C0C0D830);
  border-radius: 99px;
  padding: 4px 10px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-left: 10px;
  margin-top: 2px;
}

.orbit-recap-card-preview-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}

.orbit-recap-card-preview-stat {
  background: rgba(255,255,255,0.04);
  border-radius: 10px;
  padding: 10px 8px;
  text-align: center;
  border: 1px solid rgba(255,255,255,0.06);
}

.orbit-recap-card-preview-stat .n {
  font-family: 'Bangers', cursive;
  font-size: 24px;
  color: var(--recap-color, #C0C0D8);
  line-height: 1;
  letter-spacing: 1px;
}

.orbit-recap-card-preview-stat .l {
  font-size: 9px;
  font-weight: 800;
  color: #8080A8;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 3px;
}

.orbit-recap-card-preview-meta {
  font-size: 11px;
  color: #8080A8;
  font-weight: 700;
  margin-bottom: 10px;
  line-height: 1.5;
}

.orbit-recap-card-preview-card-pull {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 8px 12px;
  margin-bottom: 12px;
}

.orbit-recap-card-preview-card-pull-icon {
  font-size: 20px;
  flex-shrink: 0;
}

.orbit-recap-card-preview-card-pull-name {
  font-size: 12px;
  font-weight: 900;
  color: #FFFFFF;
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.orbit-recap-card-preview-card-pull-rarity {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 99px;
  flex-shrink: 0;
}

/* ── Save button ───────────────────────────────────────────── */
.orbit-recap-save-btn {
  display: block;
  width: calc(100% - 32px);
  margin: 0 16px 10px;
  padding: 14px;
  background: linear-gradient(135deg, var(--recap-color, #C0C0D8), rgba(255,255,255,0.6));
  color: #000;
  border: none;
  border-radius: 14px;
  font-family: 'Bangers', cursive;
  font-size: 22px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all 0.15s;
  box-shadow: 0 4px 16px var(--recap-glow, transparent);
  text-align: center;
}

.orbit-recap-save-btn:active {
  transform: scale(0.97);
  box-shadow: none;
}

.orbit-recap-save-btn:disabled,
.orbit-recap-save-btn.saved {
  background: #15161C;
  color: #00C853;
  border: 1px solid #00C85350;
  box-shadow: none;
  cursor: default;
  transform: none;
  letter-spacing: 1px;
  font-size: 18px;
}

/* ── Status message under save button ──────────────────────── */
.orbit-recap-save-status {
  text-align: center;
  font-size: 12px;
  font-weight: 800;
  margin: 0 16px 14px;
  min-height: 16px;
  color: #8080A8;
  transition: color 0.2s;
}

.orbit-recap-save-status.ok  { color: #00C853; }
.orbit-recap-save-status.err { color: #E8190A; }

/* ── Recap card list item (profile/collection view) ─────────── */
.orbit-recap-card {
  margin: 0 16px 10px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--recap-border, #C0C0D830);
  background: #15161C;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.orbit-recap-card:active {
  box-shadow: 0 0 16px var(--recap-glow, transparent);
}

.orbit-recap-card-stripe {
  height: 3px;
  background: linear-gradient(90deg, var(--recap-color, #C0C0D8), transparent);
}

.orbit-recap-card-body {
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.orbit-recap-card-score-block {
  text-align: center;
  flex-shrink: 0;
  width: 64px;
}

.orbit-recap-card-score-block .n {
  font-family: 'Bangers', cursive;
  font-size: 28px;
  color: var(--recap-color, #C0C0D8);
  letter-spacing: 1px;
  line-height: 1;
}

.orbit-recap-card-score-block .l {
  font-size: 9px;
  font-weight: 800;
  color: #8080A8;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: 2px;
}

.orbit-recap-card-info {
  flex: 1;
  min-width: 0;
}

.orbit-recap-card-info-title {
  font-size: 14px;
  font-weight: 900;
  color: #FFFFFF;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}

.orbit-recap-card-info-meta {
  font-size: 11px;
  color: #8080A8;
  font-weight: 700;
  line-height: 1.5;
}

.orbit-recap-card-info-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--recap-color, #C0C0D8);
  background: var(--recap-glow, rgba(192,192,216,0.1));
  border: 1px solid var(--recap-border, #C0C0D830);
  border-radius: 99px;
  padding: 3px 8px;
  margin-top: 5px;
}

/* ── View recap modal ──────────────────────────────────────── */
.orbit-recap-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.85);
  z-index: 120;
  display: none;
  align-items: flex-end;
}

.orbit-recap-modal-overlay.open {
  display: flex;
}

.orbit-recap-modal-sheet {
  width: 100%;
  background: #15161C;
  border-radius: 20px 20px 0 0;
  border-top: 3px solid var(--recap-color, #C0C0D8);
  padding: 12px 20px calc(36px + env(safe-area-inset-bottom,0px));
  max-height: 88dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.orbit-recap-modal-handle {
  width: 40px;
  height: 4px;
  background: #2A2B33;
  border-radius: 2px;
  margin: 0 auto 16px;
}

.orbit-recap-modal-close {
  display: block;
  width: 100%;
  padding: 13px;
  background: transparent;
  border: 1px solid #2A2B33;
  border-radius: 12px;
  color: #8080A8;
  font-family: 'Nunito', sans-serif;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  margin-top: 8px;
}

/* ── Section header for recap cards in profile ─────────────── */
.orbit-recap-section-header {
  padding: 16px 16px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.orbit-recap-section-header-title {
  font-family: 'Bangers', cursive;
  font-size: 20px;
  letter-spacing: 1px;
  color: #FFD700;
}

.orbit-recap-section-empty {
  padding: 24px 16px;
  text-align: center;
  color: #8080A8;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.6;
}

.orbit-recap-load-more-btn {
  display: block;
  width: calc(100% - 32px);
  margin: 4px 16px 16px;
  padding: 11px;
  background: transparent;
  border: 1px solid #2A2B33;
  border-radius: 12px;
  color: #8080A8;
  font-family: 'Nunito', sans-serif;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  text-align: center;
}

/* ── Admin recap card row ──────────────────────────────────── */
.orbit-recap-admin-card {
  border: 1px solid var(--recap-border, #2A2A5A);
  border-radius: 14px;
  background: #0B0C10;
  margin-bottom: 12px;
  overflow: hidden;
}

.orbit-recap-admin-card-stripe {
  height: 3px;
  background: linear-gradient(90deg, var(--recap-color, #C0C0D8), transparent);
}

.orbit-recap-admin-card-body {
  padding: 12px 14px;
}

.orbit-recap-admin-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 8px;
  gap: 8px;
}

.orbit-recap-admin-card-username {
  font-size: 14px;
  font-weight: 900;
  color: #F0F0FF;
}

.orbit-recap-admin-card-rarity {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--recap-color, #C0C0D8);
  border: 1px solid var(--recap-border, #C0C0D830);
  border-radius: 99px;
  padding: 3px 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.orbit-recap-admin-card-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.orbit-recap-admin-card-stat-chip {
  font-size: 11px;
  font-weight: 800;
  color: #A0A0D0;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 3px 8px;
}

.orbit-recap-admin-card-meta {
  font-size: 11px;
  color: #7070A0;
  font-weight: 800;
  margin-bottom: 10px;
  line-height: 1.5;
}

.orbit-recap-admin-card-delete-btn {
  background: rgba(232,25,10,0.12);
  border: 1px solid rgba(232,25,10,0.35);
  color: #FF6B6B;
  border-radius: 8px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  transition: background 0.15s;
}

.orbit-recap-admin-card-delete-btn:hover {
  background: rgba(232,25,10,0.25);
}

/* ── Admin filter row ──────────────────────────────────────── */
.orbit-recap-admin-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
  align-items: center;
}

.orbit-recap-admin-filter-input {
  background: #15161C;
  border: 1px solid #2A2A5A;
  border-radius: 10px;
  color: #fff;
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
  outline: none;
  flex: 1;
  min-width: 120px;
}

.orbit-recap-admin-filter-input:focus {
  border-color: rgba(255,215,0,0.5);
}

.orbit-recap-admin-filter-select {
  background: #15161C;
  border: 1px solid #2A2A5A;
  border-radius: 10px;
  color: #fff;
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
  outline: none;
}

.orbit-recap-admin-filter-select:focus {
  border-color: rgba(255,215,0,0.5);
}

/* ── Preview expand in admin ──────────────────────────────── */
.orbit-recap-admin-preview-block {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  padding: 10px 12px;
  margin-top: 8px;
  font-size: 11px;
  color: #A0A0D0;
  font-weight: 700;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-all;
  display: none;
}

.orbit-recap-admin-preview-block.open {
  display: block;
}

.orbit-recap-admin-toggle-preview-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.1);
  color: #7070A0;
  border-radius: 8px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  margin-top: 4px;
}