/* verbatim from withdraw_ticker.php <style> */
.wd-ticker{
    --wd-bg:#1c1c1c;
    --wd-card:#242424;
    --wd-border:#333;
    --wd-text:#e2e8f0;
    --wd-sub:#9ca3af;
    --wd-amount:#6ee7b7;
    background:var(--wd-bg);
    border:1px solid var(--wd-border);
    border-radius:12px;
    padding:8px 10px;
    font-family:'Kanit',sans-serif;
    color:var(--wd-text);
    overflow:hidden;
    width:100%;
    box-sizing:border-box;
}
.wd-ticker .wd-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:2px 4px 8px;
}
.wd-ticker .wd-head .wd-title{font-size:.95rem;font-weight:500;display:flex;align-items:center;gap:8px;}
.wd-ticker .wd-head .wd-live{
    display:inline-flex;align-items:center;gap:6px;font-size:.72rem;color:var(--wd-sub);
}
.wd-ticker .wd-head .wd-dot{
    width:8px;height:8px;border-radius:50%;background:#ef4444;
    box-shadow:0 0 0 0 rgba(239,68,68,.6);animation:wd-pulse 1.6s infinite;
}
@keyframes wd-pulse{0%{box-shadow:0 0 0 0 rgba(239,68,68,.6)}70%{box-shadow:0 0 0 8px rgba(239,68,68,0)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}}

.wd-ticker .wd-viewport{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.wd-ticker .wd-track{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;width:max-content;animation:wd-scroll linear infinite;}
.wd-ticker .wd-viewport:hover .wd-track{animation-play-state:paused;}
@keyframes wd-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.wd-ticker .wd-card{
    display:flex;align-items:center;gap:9px;
    background:var(--wd-card);
    border:1px solid var(--wd-border);
    border-radius:10px;
    padding:7px 11px;
    flex:0 0 auto;
    width:240px;
    box-sizing:border-box;
}
.wd-ticker .wd-logo{
    width:38px;height:38px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:.6rem;font-weight:600;flex:0 0 auto;overflow:hidden;
    box-shadow:0 2px 4px rgba(0,0,0,.3);
}
.wd-ticker .wd-logo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;}
.wd-ticker .wd-info{flex:1 1 auto;min-width:0;line-height:1.25;}
.wd-ticker .wd-phone{font-size:.85rem;font-weight:500;white-space:nowrap;}
.wd-ticker .wd-meta{font-size:.68rem;color:var(--wd-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wd-ticker .wd-right{text-align:right;flex:0 0 auto;line-height:1.25;}
.wd-ticker .wd-amount{font-size:.9rem;font-weight:600;color:var(--wd-amount);white-space:nowrap;}
.wd-ticker .wd-status{font-size:.64rem;color:var(--wd-sub);display:inline-flex;align-items:center;gap:3px;white-space:nowrap;}
.wd-ticker .wd-status i{color:#22c55e;}
/* verbatim from winner_table.php <style> */
.winner-table-section {
    --wt-bg:#1c1c1c;
    --wt-card:#242424;
    --wt-border:#333;
    --wt-text:#e2e8f0;
    --wt-sub:#9ca3af;
    --wt-amount:#e7c66e;
    background: var(--wt-bg);
    padding-top: 28px;
    padding-bottom: 28px;
    font-family: 'Kanit', sans-serif;
    color: var(--wt-text);
}
.winner-table-header { text-align: center; margin-bottom: 16px; }
.winner-title {
    color: var(--wt-text); font-size: 1.15rem; font-weight: 500; margin: 0;
    display: inline-flex; align-items: center; gap: 8px;
}
.winner-title i { font-size: 1.15rem; color: var(--wt-sub); }

/* ===== Tabs ===== */
.winner-tabs{
    max-width:1200px;margin:0 auto 16px;padding:0 15px;
    display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;justify-content:center;
    -ms-overflow-style:none;scrollbar-width:none;
}
.winner-tabs::-webkit-scrollbar{display:none;}
.winner-tab{
    flex:0 0 auto;cursor:pointer;
    background:var(--wt-card);
    border:1px solid var(--wt-border);
    color:var(--wt-sub);font-family:inherit;font-size:.82rem;font-weight:400;
    padding:6px 16px;border-radius:30px;transition:all .2s ease;white-space:nowrap;
}
.winner-tab:hover{border-color:#4b5563;color:var(--wt-text);}
.winner-tab.active{
    background:#2f2f2f;
    color:var(--wt-text);border-color:#4b5563;font-weight:500;
}

.winner-table-wrapper { max-width: 1200px; margin: 0 auto; padding: 0 15px; overflow: hidden; }
.table-responsive {
    background: var(--wt-bg); border:1px solid var(--wt-border); border-radius: 12px; padding: 10px 12px;
    overflow: hidden; -ms-overflow-style: none; scrollbar-width: none;
}
.table-responsive::-webkit-scrollbar { display: none; }

.winner-table { width: 100%; border-collapse: separate; border-spacing: 0 8px; table-layout: fixed; min-width: 100%; }
.winner-table tbody { display: table-row-group; overflow: hidden; }
.winner-table thead th {
    background: transparent; color: var(--wt-sub);
    padding: 8px 12px; font-weight: 400; text-align: center; font-size: .72rem;
    letter-spacing: .3px; border: none; white-space: nowrap;
}
.winner-table thead th:nth-child(1) { width: 24%; text-align: left; }
.winner-table thead th:nth-child(2) { width: 27%; text-align: left; }
.winner-table thead th:nth-child(3) { width: 17%; }
.winner-table thead th:nth-child(4) { width: 19%; }
.winner-table thead th:nth-child(5) { width: 13%; }

.winner-table tbody tr {
    background: var(--wt-card); transition: background 0.2s ease;
    position: relative; overflow: hidden; height: 52px;
}
.winner-table tbody tr:hover { background: #2b2b2b; }
.winner-table tbody td {
    padding: 10px 12px; color: var(--wt-text); text-align: center; border: none;
    border-top:1px solid var(--wt-border); border-bottom:1px solid var(--wt-border);
    font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.winner-table tbody tr td:first-child { border-radius: 10px 0 0 10px; border-left:1px solid var(--wt-border); text-align:left; }
.winner-table tbody tr td:last-child { border-radius: 0 10px 10px 0; border-right:1px solid var(--wt-border); }
.winner-table tbody tr td:nth-child(2) { text-align:left; }

.player-name { color: var(--wt-text); font-weight: 400; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; max-width: 100%; }
.player-name i { color: var(--wt-sub); flex-shrink: 0; }
.player-name span { overflow: hidden; text-overflow: ellipsis; }

.game-name { color: var(--wt-text); display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden; max-width:100%; }
.game-ico { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background:#2f2f2f; box-shadow:0 2px 4px rgba(0,0,0,.3); }
.game-name span { overflow: hidden; text-overflow: ellipsis; color: var(--wt-sub); }

.bet-amount { color: var(--wt-sub); font-weight: 400; white-space: nowrap; }
.win-amount { color: var(--wt-amount); font-weight: 600; font-size: .9rem; white-space: nowrap; }

.win-play {
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    cursor: pointer; border: 1px solid #2f6f4f; font-family: inherit; font-weight: 500;
    color: var(--wt-amount); font-size: .78rem; padding: 6px 14px; border-radius: 30px;
    background: rgba(110,231,183,0.08); transition: background .2s ease, border-color .2s ease;
    white-space: nowrap;
}
.win-play:hover { background: rgba(110,231,183,0.18); border-color:#3f9c6f; }
.win-play:active { background: rgba(110,231,183,0.25); }
.win-play i { font-size: .8rem; }

@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideOut { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-20px); } }
.winner-table tbody tr.new-row { animation: slideUp 0.6s ease-out; transform-origin: center; }
.winner-table tbody tr.new-row::before {
    content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(110,231,183,0.12) 50%, transparent 100%);
    animation: highlight 1.4s ease-out; pointer-events: none; border-radius: 10px;
}
@keyframes highlight { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } }
.winner-table tbody tr.remove-row { animation: slideOut 0.5s ease-out forwards; }

@media (max-width: 768px) {
    .winner-title { font-size: 1rem; }
    .winner-title i { font-size: 1rem; }
    .winner-tab { font-size: .72rem; padding: 5px 12px; }
    .winner-table thead th, .winner-table tbody td { padding: 8px 4px; font-size: .72rem; }
    .player-name { font-size: .72rem; gap: 4px; }
    .player-name i { font-size: .85rem; }
    .win-amount { font-size: .75rem; }
    .game-name { font-size: .68rem; gap: 5px; }
    .game-ico { width: 24px; height: 24px; }
    .winner-table-wrapper { padding: 0; }
    .bet-amount { font-size: .72rem; font-weight: 400; }
    .win-amount { font-weight: 400; }
    .player-name { font-weight: 400; }
    .win-play { font-size: .7rem; padding: 6px 9px; }
    .win-play span { display: none; }
    .win-play i { font-size: .9rem; }
    .table-responsive { padding: 8px 6px; }
    .winner-table tbody tr { height: 46px; }
}
