/* Loaded only by the eFootball search page. Classic PES keeps its list layout. */
.efootball-result-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 30px 18px;
}
.efootball-result-card { min-width: 0; }
.efootball-result-image { display: block; color: inherit; text-decoration: none; }
.efootball-result-image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 180 / 254;
    object-fit: contain;
    filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .32));
    transition: transform .16s ease;
}
.efootball-result-meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    text-align: center;
    overflow-wrap: anywhere;
}
.efootball-result-name {
    max-width: 100%;
    margin: 0;
    color: var(--text);
    font-size: 17px;
    line-height: 1.3;
    font-weight: 780;
}
.efootball-result-name a { color: inherit; text-decoration: none; }
.efootball-result-pack-line {
    max-width: 100%;
    margin: 0;
    font-size: 15px;
    line-height: 1.4;
}
.efootball-result-pack {
    color: #c6ccd6;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 650;
    text-decoration: none;
}
.efootball-result-name a:hover, .efootball-result-pack:hover {
    color: #ffad5c;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.efootball-result-card a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 3px; }
.efootball-result-metric {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: 2px 6px;
    max-width: 100%;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.35;
}
.efootball-result-metric strong { color: #ffad5c; font-size: 17px; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .efootball-result-image:hover img { transform: translateY(-3px); }
}
@media (max-width: 1150px) { .efootball-result-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 800px) { .efootball-result-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 540px) {
    .efootball-result-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 12px; }
    .efootball-result-meta { margin-top: 10px; gap: 7px; }
    .efootball-result-name { font-size: 16px; }
}

.results-toolbar-actions {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 9px;
}
.view-switch {
    display: inline-grid;
    grid-template-columns: repeat(2, auto);
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: rgba(9, 11, 16, .72);
}
.view-switch button {
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}
.view-switch button[aria-pressed="true"] { background: var(--surface-2); color: #ffad5c; }
.view-switch button:hover, .view-switch button:focus-visible { color: #fff; outline: 1px solid #465267; }
.table-actions { position: relative; display: flex; align-items: center; gap: 7px; }
.table-actions .button { height: 44px; padding: 0 13px; font-size: 13px; }
.table-action-status { position: absolute; right: 0; top: calc(100% + 4px); color: #9fffdc; font-size: 11px; white-space: nowrap; }

.player-table-scroll {
    width: 100%;
    margin-top: 4px;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #0b0f16;
    scrollbar-color: #3a4353 transparent;
}
.player-results-table {
    width: 100%;
    min-width: max-content;
    border-collapse: separate;
    border-spacing: 0;
    color: #d6dde7;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}
.player-results-table th, .player-results-table td {
    min-width: 88px;
    height: 42px;
    padding: 8px 11px;
    border-right: 1px solid rgba(255,255,255,.065);
    border-bottom: 1px solid rgba(255,255,255,.065);
    white-space: nowrap;
    text-align: left;
}
.player-results-table th:last-child, .player-results-table td:last-child { border-right: 0; }
.player-results-table tbody tr:last-child td { border-bottom: 0; }
.player-results-table thead th {
    position: sticky;
    z-index: 2;
    top: 0;
    height: 46px;
    background: #171d27;
    color: #f1f4f8;
    font-size: 12px;
    font-weight: 800;
}
.player-results-table thead button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.player-results-table thead button:hover, .player-results-table thead button:focus-visible { color: #ffad5c; outline: 0; }
.player-results-table tbody tr:nth-child(even) td { background: rgba(255,255,255,.018); }
.player-results-table tbody tr:hover td { background: rgba(255,127,0,.045); }
.player-results-table th.is-sort-column { background: #28231c; color: #ffc17f; }
.player-results-table td.is-sort-column, .player-results-table tbody tr:nth-child(even) td.is-sort-column { background: rgba(255,127,0,.075); }
.player-results-table tbody tr:hover td.is-sort-column { background: rgba(255,127,0,.12); }
.player-results-table .table-cell-integer, .player-results-table .table-cell-boolean { text-align: right; }
.player-results-table .table-cell-boolean { text-align: center; }
.player-results-table a, .table-copy-value { color: inherit; font: inherit; font-weight: 700; text-decoration: none; }
.player-results-table a:hover, .player-results-table a:focus-visible, .table-copy-value:hover, .table-copy-value:focus-visible { text-decoration: underline; text-underline-offset: 3px; outline: 0; }
.table-copy-value { padding: 0; border: 0; background: transparent; cursor: copy; }

.column-picker-backdrop {
    position: fixed;
    z-index: 88;
    inset: 0;
    padding: 0;
    border: 0;
    background: rgba(0,0,0,.74);
    backdrop-filter: blur(3px);
}
.column-picker {
    position: fixed;
    z-index: 89;
    top: 50%;
    left: 50%;
    width: min(680px, calc(100vw - 32px));
    max-height: min(820px, calc(100vh - 32px));
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border: 1px solid #394457;
    border-radius: 18px;
    background: #111721;
    box-shadow: 0 28px 100px rgba(0,0,0,.72);
    transform: translate(-50%, -50%);
}
.column-picker-open { overflow: hidden; }
.column-picker-header, .column-picker-footer { padding: 18px 20px; }
.column-picker-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.column-picker-header h2 { margin: 2px 0 3px; font-size: 25px; }
.column-picker-header p { margin: 0; color: var(--muted); font-size: 12px; }
.column-picker-header>button {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: none;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface-2);
    color: var(--text);
    font-size: 24px;
    cursor: pointer;
}
.column-picker-groups { min-height: 0; overflow: auto; padding: 18px 20px; scrollbar-color: #3a4353 transparent; }
.column-picker-group+.column-picker-group { margin-top: 22px; }
.column-picker-group-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.column-picker-group-header h3 { margin: 0; font-size: 17px; }
.column-picker-group-header>div { display: flex; gap: 6px; }
.column-picker-group-header button, .column-order-buttons button {
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--surface-2);
    color: #c9d2de;
    cursor: pointer;
}
.column-picker-group-header button { min-height: 32px; padding: 0 10px; font-size: 12px; font-weight: 750; }
.column-picker button:disabled { cursor: not-allowed; opacity: .34; }
.column-picker-group ul { display: grid; grid-template-columns: 1fr; gap: 6px; margin: 0; padding: 0; list-style: none; }
.column-picker-group li { min-width: 0; min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 5px 6px 5px 10px; border: 1px solid var(--line); border-radius: 8px; background: #0c1118; }
.column-picker-group li:has(input:checked) { border-color: rgba(255,127,0,.33); background: rgba(255,127,0,.055); }
.column-picker-group label { min-width: 0; display: flex; align-items: center; gap: 9px; flex: 1; color: #cbd3de; font-size: 13px; cursor: pointer; }
.column-picker-group label span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.column-picker-group input { width: 17px; height: 17px; flex: none; accent-color: var(--accent); }
.column-picker-group input:disabled+span { color: #fff; }
.column-order-buttons { display: flex; gap: 4px; }
.column-order-buttons button { width: 29px; height: 29px; padding: 0; }
.column-picker-footer { display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--line); }
.column-picker-default { margin-right: auto; }
.column-picker-footer .button { height: 46px; }

@media (max-width: 900px) {
    .results-toolbar { align-items: flex-start; gap: 14px; }
    .results-toolbar-actions { max-width: 68%; }
}
@media (max-width: 680px) {
    .results-toolbar { align-items: stretch!important; flex-direction: column; }
    .results-toolbar-actions { max-width: none; justify-content: flex-start; }
    .view-switch { order: 1; }
    .table-actions { order: 2; }
    .results-toolbar-actions .sort-picker { order: 3; margin-left: auto; }
    .table-actions .button { height: 40px; padding: 0 10px; }
    .player-table-scroll { margin-right: -2px; }
    .player-results-table { font-size: 12px; }
    .player-results-table th, .player-results-table td { min-width: 82px; height: 39px; padding: 7px 9px; }
    .column-picker { top: auto; right: 0; bottom: 0; left: 0; width: 100%; max-height: min(88vh, 820px); border-radius: 20px 20px 0 0; transform: none; }
    .column-picker-header, .column-picker-footer { padding: 15px 14px; }
    .column-picker-groups { padding: 15px 14px; }
    .column-picker-group-header { align-items: flex-start; }
    .column-picker-group-header>div { flex-wrap: wrap; justify-content: flex-end; }
    .column-picker-footer { display: grid; grid-template-columns: .8fr .9fr 1.5fr; }
    .column-picker-default { margin-right: 0; }
    .column-picker-footer .button { padding-right: 8px; padding-left: 8px; font-size: 13px; }
}