/* ═══════════════════════════════════════════════════════════════════════
   MVP Card Drops — live loot log table (drops.php)
   Reuses the site theme tokens from base.css (--gold, --bg-card, --border…).
   ═══════════════════════════════════════════════════════════════════════ */

/* Clear the fixed nav, like the other standalone sections. */
.drops-page {
    padding-top: 120px;
    padding-bottom: 80px;
    min-height: 70vh;
}

/* Empty / error notice. */
.drops-msg {
    max-width: 640px;
    margin: 2.5rem auto 0;
    padding: 1.5rem;
    text-align: center;
    color: var(--text-muted);
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
}

/* Horizontal-scroll shell so the table never breaks the page layout on phones. */
.drops-table-wrap {
    margin-top: 2.5rem;
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--bg-card);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
    -webkit-overflow-scrolling: touch;
}

.drops-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    font-size: 0.95rem;
}

/* Maroon header with gold caps, echoing the classic RO drop tables. */
.drops-table thead th {
    padding: 0.85rem 1.1rem;
    text-align: left;
    font-family: 'Cinzel', serif;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-size: 0.82rem;
    color: var(--gold-light);
    background: linear-gradient(180deg, #4a1414 0%, #360d0d 100%);
    border-bottom: 2px solid var(--gold-dark);
    white-space: nowrap;
    position: sticky;
    top: 0;
}

.drops-table tbody td {
    padding: 0.7rem 1.1rem;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}

/* Zebra striping + hover highlight. */
.drops-table tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.02);
}
.drops-table tbody tr:hover {
    background: rgba(212, 168, 83, 0.08);
}
.drops-table tbody tr:last-child td {
    border-bottom: none;
}

/* Column tints. */
.drops-table .dt-date {
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.drops-table .dt-nick {
    font-weight: 600;
    color: var(--gold-light);
}
.drops-table .dt-chance {
    color: var(--accent-blue);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Drop cell: item icon + name. */
.dt-drop {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.drop-card-icon {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.6));
}
.drop-card-name {
    color: var(--text);
}

@media (max-width: 560px) {
    .drops-page { padding-top: 96px; }
    .drops-table { font-size: 0.88rem; }
    .drops-table thead th,
    .drops-table tbody td { padding: 0.6rem 0.75rem; }
}