/* Ranking Frontend CSS */

.rnk-wrapper { padding: 10px 0; }
.rnk-last-update { font-size: 0.9em; color: #555; margin-bottom: 12px; }

.rnk-archive-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; font-size: 0.95em; flex-wrap: wrap; }
.rnk-archive-dropdown { padding: 6px 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 0.95em; cursor: pointer; background: #fff; }

.rnk-table-wrap { overflow-x: hidden; width: 100%; }

.rnk-table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    overflow-wrap: break-word;
    word-break: normal;
}

.rnk-table th, .rnk-table td { padding: 13px 15px; border: 1px solid #ddd; text-align: left; vertical-align: middle; }
.rnk-table thead th { font-size: 1.15em; font-weight: 700; }
.rnk-table tbody tr:hover { background: #fafafa; transition: background .15s; }

/* Column widths */
.rnk-table .rnk-col-pos  { width: 52px; }
.rnk-table .rnk-col-name { width: 34%; }
.rnk-table .rnk-col-extra { width: auto; }

/* Rank number never wraps */
.rnk-table .rnk-td-pos {
    white-space: nowrap;
    word-break: normal;
    text-align: center;
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-weight: 600;
    color: #555;
}

/* Numeric cells never wrap */
.rnk-number {
    display: inline-block;
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
}
.rnk-pos  { color: #1a7f37; font-weight: 700; }
.rnk-neg  { color: #d63638; font-weight: 700; }
.rnk-zero { color: #888; }

/* Profile logo */
.rnk-profile-logo {
    display: inline-block;
    width: 36px; height: 36px;
    object-fit: contain;
    vertical-align: middle;
    margin-right: 10px;
}

/* Profile link */
.rnk-profile-link,
.rnk-profile-link:hover,
.rnk-profile-link:visited,
.rnk-profile-link:focus { color: inherit; text-decoration: none; }

/* Footer */
.rnk-footer { margin-top: 30px; text-align: center; color: #404040; }
.rnk-footer p { margin-bottom: 10px; font-size: 1em; }
.rnk-footer-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; margin-top: 8px; }
.rnk-footer-logo { width: 80px; height: 80px; object-fit: contain; }

.rnk-loading { text-align: center; padding: 30px; color: #888; font-style: italic; }
.rnk-nowrap { white-space: nowrap !important; }

/* ── Mobile ── */
@media (max-width: 640px) {
    .rnk-table th, .rnk-table td { padding: 7px 5px !important; font-size: 0.8em !important; vertical-align: top !important; }

    .rnk-table thead th { font-size: 0 !important; white-space: nowrap !important; overflow: hidden !important; text-align: center !important; }
    .rnk-table thead th::after { font-size: 12px !important; font-weight: 700 !important; display: block !important; text-align: center !important; }
    /* column header abbrs injected dynamically by shortcode */

    .rnk-table .rnk-col-pos  { width: 36px; }
    .rnk-table .rnk-col-name { width: 34%; }

    /* Logo block above name */
    .rnk-table .rnk-td-name img.rnk-profile-logo,
    img.rnk-profile-logo {
        display: block !important;
        width: 28px !important; height: 28px !important;
        margin: 0 0 4px 0 !important;
        float: none !important;
    }

    /* Numeric cols — fixed width, never wrap */
    .rnk-table .rnk-td-num {
        text-align: center !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow: visible !important;
        width: 52px !important;
    }
    .rnk-number {
        white-space: nowrap !important;
        word-break: normal !important;
    }
}

@media (max-width: 380px) {
    .rnk-table th, .rnk-table td { padding: 5px 3px !important; font-size: 0.72em !important; }
    .rnk-table .rnk-col-name { width: 30%; }
}