/* 그리드벳 스포츠 — 원본 CSS(layout_pc/mobile.css · module.css · prematch.css · inplay.css)에 없는 칸만 원본 색 변수로 보탠다 */

/* 알림 띠 #trToast 는 모든 쪽 공통 tr-shell.css 로 옮겼다 */

/* 종목 탭 숫자 */
.tabTitle.depth2 .tr-n{margin-left:3px;font-size:11px;color:var(--38ffa8)}

/* 검색 · 정렬 줄 */
.tr-tools{display:flex;align-items:center;gap:8px;margin:12px 0 0}
.tr-search{position:relative;flex:1;max-width:320px}
.tr-search input{width:100%;height:35px;padding:0 36px 0 12px;border:1px solid var(--4246);border-radius:8px;background:var(--3838);font-size:12px;color:var(--font-color);outline:none}
.tr-search input:focus{border-color:var(--38ffa8)}
.tr-search .iconfont{position:absolute;top:50%;right:12px;transform:translateY(-50%);font-size:14px;color:var(--a4a2a4);pointer-events:none}
.tr-tools select,.tr-sort{height:35px;padding:0 28px 0 12px;border:1px solid var(--4246);border-radius:8px;background:var(--3838) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath d='M958.388 321.118l-63.397-64.032-383.606 380.993-380.377-384.196-63.397 64.032 380.377 384.196 63.397 63.397 63.397-63.397L958.388 321.118z' fill='%23a4a2a4'/%3E%3C/svg%3E") no-repeat right 10px center;background-size:12px 12px;font-size:12px;color:var(--font-color);outline:none;appearance:none;cursor:pointer}
.tr-stat{margin:10px 0 0;padding:10px 14px;border-radius:8px;background:var(--3838);font-size:12px;color:var(--aeae)}
.tr-stat.is-err{color:#ffb36b}
.tr-note{margin:10px 0 0;font-size:11px;line-height:1.6;color:var(--939393)}

/* 다폴더 보너스 안내(원본 .bonus-folder 틀, 누르는 칸 아님) */
#trBonus div ul li{cursor:default}
#trBonus div ul li:hover{border-color:transparent}
#trBonus h4 span{font-size:11px;color:var(--939393)}

/* 국내형 배당판 */
.tr-board .tr-thead{margin-top:12px;padding:0 10px;border-radius:10px;background:var(--3838);color:var(--aeae)}
.tr-board .game_data.tr-lg{padding-bottom:2px}
.tr-lg-hd{display:flex;align-items:center;gap:8px;height:42px;font-size:13px;color:var(--font-color)}
.tr-lg-hd img{width:16px;height:16px;object-fit:contain}
.tr-lg-hd .fi{width:20px!important;height:15px;border-radius:3px;background-size:cover}
.tr-lg-hd strong{overflow:hidden;min-width:0;font-family:'p6';font-weight:normal;white-space:nowrap;text-overflow:ellipsis}
.tr-lg-hd em{margin-left:auto;font-style:normal;font-size:11px;color:var(--939393)}
.tr-ev{padding:0 0 6px}
.tr-ev+.tr-ev{padding-top:6px;border-top:1px dashed rgba(98,105,113,.35)}
.tr-board .g_item{padding-bottom:4px!important}
.tr-board .g_item li.g_day{flex-direction:column;gap:2px;line-height:1.15;text-align:center}
.tr-board .g_item li.g_day .tr-kind{color:var(--aeae)}
.tr-board .g_item li.g_day .tr-ot{font-size:10px;color:var(--939393)}
.tr-board .g_item li.g_day .tr-clock{color:var(--38ffa8)}
.tr-board .g_item li.g_day .tr-score{font-family:'p7';font-size:12px;color:var(--font-color)}
.tr-board .g_item li.tr-vs{cursor:default;background:var(--left-bg)}
.tr-board .g_item li.tr-vs .g_odd_o{color:var(--aeae)}
.tr-board .g_item li .tr-mk{margin:0 4px;font-style:normal;font-size:10px}
.tr-board .g_item li .tr-mk.is-h{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:3px;background:var(--4246);color:var(--aeae)}
.tr-board .g_item li .tr-mk.red{color:#ff4d6d}
.tr-board .g_item li .tr-mk.blue{color:#009cff}
.tr-board .g_item li.g_more a.g_list_hold,.tr-board .g_item li.g_more a.g_list_view{cursor:pointer}
.tr-board .g_item li.g_gr_d .iconfont{font-size:12px;color:var(--939393)}
.tr-board .game_sub>div>.g_item{padding-top:4px}
.tr-sub-msg{margin:6px 0;padding:10px;border-radius:5px;background:var(--left-bg);font-size:12px;color:var(--aeae);text-align:center}
.tr-sub-msg a{color:var(--38ffa8);text-decoration:underline}
.tr-more{margin:12px 0 0;text-align:center}
.tr-more button{width:100%;height:42px;border:1px solid var(--4246);border-radius:10px;background:var(--3838);font-size:13px;color:var(--font-color);cursor:pointer}
.tr-more button:hover{border-color:var(--38ffa8)}

/* 배당 오르내림 */
.tr-up,.tr-dn{position:relative}
.tr-up{color:#38ffa8!important}
.tr-dn{color:#ff4d6d!important}
.tr-up::after{content:'▲';margin-left:2px;font-size:8px}
.tr-dn::after{content:'▼';margin-left:2px;font-size:8px}

/* 슬립 */
#picklist li.tr-pk-off{opacity:.55}
#picklist li .tr-pk-msg{margin-top:8px;font-size:11px;line-height:1.5;color:#ffb36b}
#picklist li .selInfo .tr-low{margin-left:auto;padding:0 6px;border-radius:8px;background:var(--4246);font-style:normal;font-size:10px;color:var(--aeae)}
#picklist li .teams span.selected{color:var(--38ffa8)}
#picklist li .delete{cursor:pointer}

/* 프리매치 · 인플레이 */
#trEuro .filter{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px}
#trEuro .filter > span:first-child{flex:1;min-width:0}
.games-list li .game-date.league-date{justify-content:flex-start;gap:6px}
.games-list li .game-date.league-date .txt{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}
.games-list li .game-date.league-date .date{margin-left:auto;font-style:normal;font-size:12px;color:var(--a4a2a4);white-space:nowrap}
.games-list li .game-date.league-date .fi{flex:0 0 21px;height:16px;border-radius:3px}
.prematch .tabTitle.depth2{margin-bottom:0}
.games-list li.active .game-info{display:block}
.games-list li .game-info .g-date em{color:var(--38ffa8)}
.games-list li .game-info .g-rate button span+span{margin-left:6px}
.games-list li .game-info .g-rate button:disabled{cursor:not-allowed;opacity:.6}
.games-list li .game-info .g-rate button:disabled:hover{border-color:transparent}
.games-list .tr-li-msg{background:none!important}
.games-list .tr-li-msg .no-data{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:40px 0 50px;color:var(--a4a2a4);font-size:13px}
.games-list .tr-li-msg .no-data .iconfont{font-size:50px}
.games-list .tr-li-msg:not(:has(.no-data)){padding:20px;font-size:12px;color:var(--aeae);text-align:center}
.filter #trCur{display:flex;align-items:center;gap:6px;min-width:0;font-family:'p6';font-weight:normal;font-size:13px;color:var(--font-color)}
.filter #trCur .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.filter #trCur .fi{width:20px!important;height:15px;border-radius:3px}
.filter #trCur .tr-clear{margin-left:6px;font-family:'p4';font-size:11px;color:var(--38ffa8);text-decoration:underline}
.filter .tr-sort{height:28px;font-size:11px}
.game-subs li .rates .grid button:disabled{cursor:not-allowed;opacity:.55}
.game-subs li .rates .grid button:disabled:hover{border-color:transparent}
.game-subs li .rates .grid button .iconfont,.games-list li .game-info .g-rate button .iconfont{font-size:12px;color:var(--939393)}
.game-subs li .title .tr-ot,.tr-ot{font-size:10px;color:var(--939393)}
.game-subs .tr-sub-note{padding:14px;border-radius:5px;background:var(--3838);font-size:12px;color:var(--aeae);text-align:center}
.game-subs .tr-sub-note a{color:var(--38ffa8);text-decoration:underline}
.game-button button[data-reload]{width:32px}
.right-panel .tr-detail-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:300px;border-radius:10px;background:var(--3838);color:var(--a4a2a4);font-size:13px}
.right-panel .tr-detail-empty .iconfont{font-size:50px}
.game-image div:nth-of-type(2) strong{font-family:'p7'}
/* 인플레이 상세 머리 가운데(점수 · 시간): 원본처럼 리그(.s-league)는 숨기고, 좁은 폭에서도 "43 : 4/5" · "3쿼/터" 로 쪼개지지 않게 */
body[data-tr-page="main/inplayDev.php"] .game-image div:nth-of-type(2) > *{flex:none;white-space:nowrap}
/* 인플레이 목록 카드 가운데(점수 · 시간): 원본 120px(모바일 100px) 칸은 점수 칸 둘을 빼면 34px 뿐이라 "후반 5/3'" · "하프타/임" 처럼 글자 중간에서 쪼개졌다 — 칸을 넓히고 띄어쓰기에서만 줄을 바꾼다 */
body[data-tr-page="main/inplayDev.php"] .games-list li .game-info .g-info{grid-template-columns:1fr 150px 1fr}
body[data-tr-page="main/inplayDev.php"] .games-list li .game-info .g-info p em{flex:1 1 auto;min-width:0;padding:0 3px;word-break:keep-all;overflow-wrap:anywhere}
@media screen and (max-width:1023px){
	body[data-tr-page="main/inplayDev.php"] .games-list li .game-info .g-info{grid-template-columns:1fr 124px 1fr}
}
/* 목록 · 상세 칸 스크롤바: 원본 CSS 가 overflow:scroll 로 늘 켜 두어 윈도 크롬에서 흰 기본 막대가 그려진다 — 원본 #left · #right 처럼 막대는 그리지 않는다(휠 · 끌기 스크롤은 그대로) */
.prematch .left-panel,.prematch .right-panel,.prematch .game-subs{scrollbar-width:none;overscroll-behavior:contain}
.prematch .left-panel::-webkit-scrollbar,.prematch .right-panel::-webkit-scrollbar,.prematch .game-subs::-webkit-scrollbar{display:none}
@media screen and (min-width:1024px){
	.right-panel .game-locate{display:none}
	.prematch .games{margin-top:10px}
	/* 2단(프리매치 · 인플레이)이 창 높이 안에 들어오게 — 원본 calc(100vh - 110px · 130px)는 위 종목 탭 줄만큼 창 밖으로 넘쳐 창 전체도 같이 스크롤됐다.
	   탭 줄 + 2단 묶음(.prematch-content, 위 머리 60 + 여백 30 아래)을 창 바닥 20px 위까지로 두고, 2단은 탭 줄(한 줄 · 두 줄)을 뺀 나머지를 채운다 */
	.prematch .prematch-content{display:flex;flex-direction:column;height:calc(100vh - 110px);min-height:465px}
	.prematch .prematch-content > .games{flex:1 1 auto;height:auto;min-height:400px}
	/* 프리매치 상세: 경기 그림 · 마켓 단추 아래 남은 높이를 마켓 목록이 채운다(원본 game-subs calc(100vh - 270px)는 줄인 칸 밖으로 잘린다) */
	body[data-tr-page="main/prematchDev.php"] .prematch .games .right-panel{display:flex;flex-direction:column}
	body[data-tr-page="main/prematchDev.php"] .prematch .games .right-panel > *{flex:0 0 auto}
	body[data-tr-page="main/prematchDev.php"] .prematch .games .right-panel > .game-subs{flex:1 1 auto;height:auto;min-height:0}
	/* 종목 탭 줄: 칸보다 많으면 가로 스크롤바 대신 다음 줄로(한 줄이면 원본과 같은 55px, 두 줄이면 2단 칸이 그만큼 줄어든다) */
	#trSports.tabTitle.depth2{overflow:visible;white-space:normal;padding-top:7px;padding-bottom:7px}
	#trSports.tabTitle.depth2 a{display:inline-block;margin:0 25px 0 0;line-height:41px}
}
@media screen and (max-width:1023px){
	.tr-tools{flex-wrap:wrap}
	.tr-search{max-width:none}
	.tr-board .tr-thead{display:none}
	.tr-board .g_item li.g_day{flex-direction:row;gap:8px}
	/* 핸디캡 · 오버언더 줄은 머리줄(시간 · 더보기) 없이 한 줄로 — 기준점과 H · ▲▼ 표시로 가른다 */
	.tr-board .g_item:not(.tr-main) li.g_day,.tr-board .g_item:not(.tr-main) li.g_more{display:none}
	.tr-board .g_item li .tr-mk.is-h{width:13px;height:13px;margin:0 3px}
	.tr-ev+.tr-ev{padding-top:8px}
	.bonus-folder div ul li{padding:0 8px}
	.prematch{flex-direction:column}
	.prematch .left-panel .wrapping{margin:10px 0 0}
	/* 인플레이 쪽도 프리매치처럼 오른쪽 칸이 화면을 덮는다 */
	.prematch > .right-panel{overflow:hidden auto;position:fixed;top:0;right:0;bottom:0;width:100%;padding:0 10px 90px;background:var(--body-bg);transform:translate3d(100%,0,0);transition:transform .3s ease;z-index:666}
	.prematch > .right-panel.active{transform:translate3d(0,0,0)}
	.prematch > .right-panel .game-image{background-size:cover}
	.prematch > .right-panel .game-subs{height:auto;overflow:visible}
}
