/* ===== Promotions Page Styles ===== */

/* Rank Cards */
.rank-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: default;
}
.rank-card:hover {
  transform: scale(1.05);
  box-shadow: 0 0 12px rgba(250, 204, 21, 0.4);
}
.rank-card h3,
.rank-card p {
  user-select: none;
  cursor: default;
}

/* Pet Points Card Table */
/* Pet Points Card Table */
#petTable {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 0.95rem;
  background: transparent !important;
  border: none !important;              /* 🚫 kill outer border */
  box-shadow: none !important;          /* 🚫 kill ghost box */
}

#petTable thead {
  background: rgba(55,65,81,0.7);       /* dark header bar */
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border: none !important;
}

#petTable th,
#petTable td {
  padding: 0.65rem 1rem;
  border: none !important;
  background: transparent !important;
}

/* === Group Rows as Divider Bars === */
#petTable .group-row td {
  background: linear-gradient(90deg, rgba(250,204,21,0.15), rgba(55,65,81,0.7));
  color: #facc15;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.4rem 0.75rem;
  border: none !important;
}

/* Hover effect for normal rows only */
#petTable tr:not(.group-row):hover td {
  background-color: rgba(56,189,248,0.08) !important;
  transition: background 0.2s ease-in-out;
}

#petTable td:first-child {
  text-align: left;
  font-weight: 500;
  color: #e2e8f0;
}
#petTable td:last-child {
  text-align: right;
  font-weight: 600;
  color: #facc15;
}


/* General table containment */
.card table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
.card th,
.card td {
  word-wrap: break-word;
  white-space: normal;
  overflow-wrap: break-word;
}

/* Scrollable tables inside cards (prevents overflow) */
.card .table-scroll {
  max-height: 400px;             /* adjust per section */
  overflow-y: auto;
}
.card .table-scroll::-webkit-scrollbar {
  width: 8px;
}
.card .table-scroll::-webkit-scrollbar-thumb {
  background: #facc15;
  border-radius: 4px;
}
.card .table-scroll::-webkit-scrollbar-track {
  background: transparent;
}

/* Accordion headers */
.accordion-header {
  cursor: pointer;
  user-select: none;
}
.accordion-toggle svg {
  transition: transform 0.3s ease;
}
.accordion-toggle.rotate-180 {
  transform: rotate(180deg);
}

/* Shared card tweaks */
.card.collapsed .accordion-body {
  display: none;
}
