.playerstat-wrapper{max-width:1240px;width:calc(100% - 24px);margin:20px auto 40px;color:#fff;font-family:'Jost',sans-serif;background:#2e2750;border-radius:12px;padding:16px;display:flex;flex-direction:column;}
.playerstat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:20px;}
.playerstat-title{font-size:28px;font-weight:800;margin:0;}
.playerstat-tabs{display:flex;gap:0;margin:6px 0 14px;background:#4a4270;border-radius:6px;padding:4px;width:100%;}
.stat-tab{flex:1 1 0;padding:6px 10px;text-align:center;border-radius:4px;cursor:pointer;font-size:13px;font-weight:700;color:#dce0f2;transition:0.2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.stat-tab.active{background:#8b74f1;color:#ffffff;}
.stat-content{background:transparent;border-radius:8px;padding:0;overflow-x:auto;}
.stat-table{width:100%;border-collapse:separate;border-spacing:0 4px;background:transparent;}
.stat-table th,.stat-table td{padding:9px 10px;text-align:left;border:0;}
.stat-table th{color:#bcb4d8;font-weight:700;font-size:13px;}
.icon-head{text-align:center !important;}
.th-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1;color:#bcb4d8;}
.th-icon svg{display:block;width:auto;height:20px;}
.stat-table tbody tr{border-radius:6px;}
.stat-table tbody tr:nth-child(even){background:#2e2750;}
.stat-table tbody tr:nth-child(odd){background:#2b2149;}
.stat-table tbody tr td:first-child{border-left:2px solid transparent;border-radius:6px 0 0 6px;}
.stat-table tbody tr:first-child td:first-child{border-left-color:#39d68d;}
.stat-table tbody tr:last-child td:first-child{border-left-color:#d7263d;}
.stat-table tbody tr td:last-child{border-radius:0 6px 6px 0;}
.rank-col{width:52px;font-weight:800;text-align:left;font-size:16px;line-height:1;}
.player-col{display:flex;align-items:center;gap:10px;}
.player-info-wrap{display:flex;flex-direction:column;gap:3px;}
.player-img{width:34px;height:34px;border-radius:999px;object-fit:cover;}
.player-name{font-weight:700;font-size:15px;color:#fff;text-decoration:none;}
.player-name:hover{text-decoration:underline;}
.player-team{color:#ddd5ef;font-size:14px;font-weight:600;}
.player-team-row{display:flex;align-items:center;gap:6px;color:#bcb4d8;font-size:12px;font-weight:500;}
.player-team-row img{width:14px;height:14px;border-radius:999px;object-fit:cover;}
.val-col{font-weight:800;color:#fff;font-size:17px;text-align:center;}
.metric-pill{display:inline-flex;align-items:center;justify-content:center;min-width:30px;padding:2px 8px;border-radius:4px;line-height:1.1;}
.metric-pill-green{background:#2fda83;color:#1f2638;}

/* B2/C2: Green pill only for rank-1; all other rows use neutral */
.stat-table tbody tr:not(:first-child) .metric-pill-green {
    background: rgba(255,255,255,0.1);
    color: #fff;
}
.highlight-red{color:#fff;}
.stat-neutral-value{color:#c4bddb;font-weight:500;}
.stat-table td:nth-child(3),.stat-table td:nth-child(4),.stat-table td:nth-child(5),.stat-table td:nth-child(6),.stat-table th:nth-child(3),.stat-table th:nth-child(4),.stat-table th:nth-child(5),.stat-table th:nth-child(6){text-align:center;}
.stat-table td:nth-child(3){font-size:16px;font-weight:700;}
.playerstat-header .socca-select-shell{position:relative;width:100%;max-width:283px;min-height:46px;background:#231c3d;border:1px solid #6f58cf;border-radius:10px;box-shadow:0 0 0 1px rgba(139,116,241,0.15) inset;display:flex;align-items:center;overflow:hidden;}
.playerstat-header .socca-select-shell .socca-select{background:transparent;color:#f5f7ff;font-weight:600;width:100%;height:46px;padding:0 38px 0 42px;border:0;outline:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;}
.playerstat-header .socca-select-shell .socca-select-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#b9a8ff;pointer-events:none;z-index:2;}
.playerstat-header .socca-select-shell::after{content:"";position:absolute;right:12px;top:50%;width:8px;height:8px;border-right:2px solid #b9a8ff;border-bottom:2px solid #b9a8ff;transform:translateY(-62%) rotate(45deg);pointer-events:none;z-index:2;border-right-color:#b9a8ff;border-bottom-color:#b9a8ff;}
.playerstat-header .socca-select-shell .socca-select:hover,
.playerstat-header .socca-select-shell .socca-select:focus{background:rgba(139,116,241,0.12);}
.playerstat-header .socca-select-shell .socca-select option{background:#231c3d;color:#f5f7ff;}
.playerstat-header form select:not(.socca-select){background:#2e2750;color:#fff;border:1px solid #4a4270;padding:8px 12px;border-radius:8px;min-width:160px;}
 .stat-content .stat-table{min-width:760px;}

/* Mobile Card View for Player Stats */
.mobile-player-card {
    display: none;
}

.mobile-stat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 12px 10px;
    color: #bcb4d8;
    font-size: 11px;
    font-weight: 600;
}

.mobile-stat-header-icons {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mobile-stat-header-icon {
    display: inline-flex;
    align-items: center;
    color: #bcb4d8;
}

.mobile-stat-header-icon svg {
    display: block;
    height: 18px;
    width: auto;
}

@media (max-width: 1024px){
    .playerstat-title{font-size:24px;}
    .stat-tab{min-width:0;}
}

@media (max-width: 768px){
    .playerstat-wrapper{
        width:calc(100% - 12px);
        padding:10px;
        background:transparent;
        border-radius:0;
    }

    .playerstat-title{font-size:18px;line-height:24px;}

    .playerstat-header{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }

    .playerstat-header .socca-select-shell,
    .playerstat-header .socca-select{
        width:100%;
        min-width:0;
        max-width:none;
    }

    .playerstat-tabs{
        overflow-x:auto;
        gap:0;
        height:auto;
        background:#1f1a38;
        border-radius:8px;
        padding:4px;
    }

    .stat-tab{
        font-size:12px;
        padding:8px 6px;
        flex:1;
        min-width:0;
    }

    .stat-content{
        padding:0;
        overflow-x:visible;
    }

    /* Hide table on mobile, show cards instead */
    .stat-content .stat-table{
        display: none;
    }

    .mobile-player-card {
        display: block;
    }

    .mobile-player-card .player-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 12px;
        background: #2e2750;
        border-radius: 6px;
        margin-bottom: 6px;
    }

    .mobile-player-card .player-card:nth-child(odd) {
        background: #302852;
    }

    .mobile-player-card .player-card:first-child {
        border-left: 3px solid #39d68d;
    }

    .mobile-player-card .player-card-left {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .mobile-player-card .player-card-rank {
        font-size: 14px;
        font-weight: 800;
        color: #fff;
        min-width: 20px;
    }

    .mobile-player-card .player-card-player {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .mobile-player-card .player-card-player img {
        width: 28px;
        height: 28px;
        border-radius: 50%;
        object-fit: cover;
    }

    .mobile-player-card .player-card-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .mobile-player-card .player-card-name {
        font-size: 13px;
        font-weight: 600;
        color: #fff;
        text-decoration: none;
    }

    .mobile-player-card .player-card-team {
        display: flex;
        align-items: center;
        gap: 4px;
        font-size: 10px;
        color: #9f9f9f;
    }

    .mobile-player-card .player-card-team img {
        width: 12px;
        height: 12px;
        border-radius: 50%;
    }

    .mobile-player-card .player-card-right {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .mobile-stat-header-icon,
    .player-card-matches,
    .player-card-value {
        min-width: 32px;
        text-align: center;
    }

    .mobile-player-card .player-card-matches {
        font-size: 12px;
        color: #9f9f9f;
    }

    .mobile-player-card .player-card-value {
        font-size: 14px;
        font-weight: 700;
        color: #fff;
        min-width: 30px;
        text-align: center;
    }

    .mobile-player-card .player-card-value.green {
        background: #2fda83;
        color: #1f2638;
        padding: 2px 8px;
        border-radius: 3px;
    }

    .mobile-player-card .player-card-cards {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .mobile-player-card .player-card-cards .yellow-card {
        color: #DC9F03;
        font-size: 12px;
        font-weight: 600;
    }

    .mobile-player-card .player-card-cards .red-card {
        color: #EF3340;
        font-size: 12px;
        font-weight: 600;
    }

    .rank-col,.val-col,.player-name,.player-team,.stat-table td:nth-child(3){font-size:10px;}
    .player-img{width:20px;height:20px;}
    .player-team-row{font-size:10px;}
    .player-team-row img{width:16px;height:16px;}
}

@media (max-width: 425px) {
    .playerstat-wrapper {
        padding: 8px;
    }

    .playerstat-title {
        font-size: 16px;
    }

    .stat-tab {
        font-size: 11px;
        padding: 6px 4px;
    }

    .mobile-player-card .player-card {
        padding: 8px 10px;
    }

    .mobile-player-card .player-card-rank {
        font-size: 12px;
    }

    .mobile-player-card .player-card-player img {
        width: 24px;
        height: 24px;
    }

    .mobile-player-card .player-card-name {
        font-size: 11px;
    }

    .mobile-player-card .player-card-team {
        font-size: 9px;
    }

    .mobile-player-card .player-card-matches {
        font-size: 10px;
    }

    .mobile-player-card .player-card-value {
        font-size: 12px;
    }
}