/* ==========================================================
ws-combo.css — 메인판(#comboTable) · 승부사보험(.right-table)
· 미보험조합(#uncoveredPanel)
의존: ws-base.css
========================================================== */

/* ── 메인판 ── */
#comboArea3 {
background:var(--card); border-radius:var(--radius);
box-shadow:var(--shadow); padding:14px 16px; margin-bottom:14px;
display:none; align-items:stretch; flex-wrap:nowrap; gap:12px;
border:1px solid var(--border);
}
/* 비율 배분: 메인 3 > 승부사 2 > 미보험경기 1.5 */
#comboArea3 > #comboTable { flex:4.5 1 0; min-width:0; }
#comboArea3 > .right-table { flex:1.5 1 0; min-width:0; }
#comboArea3 > #uncoveredPanel { flex:1.5 1 0; min-width:0; overflow:hidden; }
#uncoveredPanel table { table-layout:fixed; height:100%; }
#uncoveredPanel td, #uncoveredPanel th { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#comboTable { border-collapse:collapse; table-layout:fixed; width:100%; }
#comboTable th {
  background:var(--accent); color:#fff; padding:6px 8px;
  font-size:12px; font-weight:700; border:1px solid var(--accent);
  border-radius:0; height:30px; box-sizing:border-box;
  }
#comboTable td {
border:1px solid var(--border); padding:4px 6px;
text-align:center; font-size:12px; background:var(--card); color:var(--text);
max-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* 3번째 경기 빈칸 안내 플레이스홀더 */
/* #comboRow3 td { background:#fdf6dc !important; } */

.right-table { border-collapse:collapse; table-layout:fixed; width:100%; height:100%; border-radius:0; }
.right-table th {
  background:var(--accent2); color:#fff; padding:6px 8px;
  font-size:12px; font-weight:700; border-radius:0; height:30px; box-sizing:border-box;
  }
.right-table td {
border:1px solid var(--border); padding:5px 8px;
text-align:center; font-size:12px; background:var(--card); color:var(--text);
max-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* ── 승부사 보험선택 깜빡임 ─────────── */
/* 승부사보험 보험선택 드롭다운 최초 테두리 깜빡임 */
@keyframes fiOppBlink{
0%,100%{ border-color:#1a3a6a; box-shadow:0 0 0 rgba(125,211,252,0); }
50%{ border-color:#7dd3fc; box-shadow:0 0 8px rgba(125,211,252,.75); }
}
#fiOppSelect.fi-blink{ border-width:2px; animation:fiOppBlink 1.6s ease-in-out infinite; }


/* ── 모바일: 3표 가로 배분 ───────────────────────────── */
@media (max-width:768px){

/* ── 메인판: 가로 꽉 채우기 ── */
#comboArea3{ flex-wrap:wrap !important; gap:8px !important; padding:0 !important;
background:transparent !important; border:none !important; box-shadow:none !important; }
#comboArea3 > #comboTable,
#comboArea3 > .right-table,
#comboArea3 > #uncoveredPanel{ flex:1 1 100% !important; width:100% !important; }
/* 3개 표 공통 */
#comboArea3 table{ width:100% !important; table-layout:fixed !important; }
#comboArea3 colgroup col{ width:auto !important; }
#uncoveredPanel{ display:none !important; }
#comboTable tbody td[id$="-name"] > span{ margin-left:0 !important; }
/* Winnerscore: 번호칸 고정 + 숨은 배당칸 3개 폭 제거 */
#comboTable colgroup col:first-child{ width:24px !important; }
#comboTable colgroup col:nth-child(5),
#comboTable colgroup col:nth-child(6),
#comboTable colgroup col:nth-child(7){ width:0 !important; }
#comboTable th:nth-child(3),
#comboTable td:nth-child(5),
#comboTable td:nth-child(6),
#comboTable td:nth-child(7){ display:none !important; }

/* 승부사: 숨은 2번째칸 폭 제거 */
#comboArea3 > .right-table colgroup col:nth-child(2){ width:0 !important; }

/* 승부사 한 줄 */
#comboArea3 > .right-table.ws-fi-empty{ display:none !important; }
#comboArea3 > .right-table{
  display:flex !important; align-items:stretch !important; width:100% !important;
border-collapse:collapse !important; box-sizing:border-box !important;
background:#16305e !important; border:1px solid #2a4a80 !important;
border-radius:0 !important; }
#comboArea3 > .right-table colgroup{ display:none !important; }
#comboArea3 > .right-table thead{ display:flex !important; align-items:center !important;
  flex:0 0 56px !important; line-height:22px !important;
  border-right:1px solid #4a9eff !important; }
#comboArea3 > .right-table thead tr{ display:block !important; }
#comboArea3 > .right-table thead th{
display:block !important; text-align:center !important;
color:#4a9eff !important; background:transparent !important; border:none !important;
padding:0 6px !important; font-size:14px !important; font-weight:700 !important;
line-height:22px !important; height:auto !important;
white-space:nowrap !important; }
#comboArea3 > .right-table thead th[style*="display:none"]{ display:none !important; }
#comboArea3 > .right-table tbody{
  display:flex !important; align-items:center !important;
  line-height:22px !important; padding:1px 8px !important; }
  #comboArea3 > .right-table tbody tr{ display:flex !important; align-items:center !important; flex-wrap:nowrap !important; min-width:0 !important; }
  #comboArea3 > .right-table tbody td{
    display:inline-block !important; background:transparent !important; border:none !important;
    padding:0 8px 0 0 !important; font-weight:400 !important;
    font-size:14px !important; line-height:22px !important; color:#cccccc !important;
    width:auto !important; max-width:none !important; min-width:0 !important;
    height:auto !important; flex:0 0 auto !important;
    white-space:nowrap !important; overflow:visible !important; text-overflow:clip !important; }
#comboArea3 > .right-table tbody td[style*="display:none"]{ display:none !important; }
#comboArea3 > .right-table tbody td span{ font-weight:900 !important; line-height:22px !important; vertical-align:middle !important; }
#comboArea3 > .right-table tbody td > span:first-child{ color:#cccccc !important; }
#comboArea3 > .right-table tbody tr:has(> td[data-raw-label="A"]),
#comboArea3 > .right-table tbody tr:has(> td[data-raw-label="B"]),
#comboArea3 > .right-table tbody tr:has(> td[data-raw-label="C"]),
#comboArea3 > .right-table tbody tr:has(> td[data-raw-label=""]){ display:none !important; }

/* 미보험경기 */
#uncoveredPanel colgroup col:first-child{ width:72% !important; }
#uncoveredPanel colgroup col:nth-child(2){ width:28% !important; }

/* 행 높이·글씨·테두리 완전 통일 */
#comboArea3 table{ border-collapse:collapse !important; }
#comboArea3 th{
height:30px !important; padding:4px 2px !important; font-size:11px !important;
border-radius:0 !important; border:1px solid var(--border) !important;
}
#comboArea3 #comboTable thead th{ font-size:15px !important; letter-spacing:0.5px !important; }
#comboArea3 td{
height:34px !important; padding:4px 2px !important; font-size:11px !important;
border-radius:0 !important; border:1px solid var(--border) !important;
}
}


/* ── 승부사 · 미보험 스크롤 영역 ─────────────────────── */
#fighterInsuranceScroll{max-height:270px;overflow-y:auto;overflow-x:hidden;border:1px solid #1a3a6a;border-radius:6px;}
#fighterInsuranceScroll thead th{position:sticky;top:0;z-index:3;}
#fighterInsuranceScroll::-webkit-scrollbar{width:10px;}
#fighterInsuranceScroll::-webkit-scrollbar-track{background:#0a1a3a;}
#fighterInsuranceScroll::-webkit-scrollbar-thumb{background:#4a9eff;border-radius:5px;}
#fighterInsuranceScroll tbody td:nth-child(5),
#fighterInsuranceScroll tbody td:nth-child(6){font-size:13px;}

#uncoveredComboScroll{max-height:270px;overflow-y:auto;overflow-x:hidden;border:1px solid #1a4d1a;border-radius:6px;}
#uncoveredComboScroll thead th{position:sticky;top:0;z-index:3;}
#uncoveredComboScroll::-webkit-scrollbar{width:10px;}
#uncoveredComboScroll::-webkit-scrollbar-track{background:#0a2e0a;}
#uncoveredComboScroll::-webkit-scrollbar-thumb{background:#4ade80;border-radius:5px;}
#uncoveredComboScroll tbody td:nth-child(5),
#uncoveredComboScroll tbody td:nth-child(6){font-size:13px;}


/* ── 모바일: 승부사 · 미보험 ─────────────────────────── */

@media (max-width:768px){
#fighterInsuranceWrap{ padding:10px 8px !important; }

/* 상단 컨트롤: 1줄=제목/합계/총개수, 2줄=개수+버튼+자동·수동 (승부사/미보험 공통) */
#fighterInsuranceWrap > div:first-of-type,
#uncoveredComboWrap   > div:first-of-type{
display:grid !important;
grid-template-columns:auto 24px auto auto 1fr;
gap:2px !important;
align-items:center;
}
#fighterInsuranceWrap > div:first-of-type > *,
#uncoveredComboWrap   > div:first-of-type > *{ min-width:0; }

#fighterInsuranceWrap > div:first-of-type > span:nth-child(1),
#uncoveredComboWrap   > div:first-of-type > span:nth-child(1){ grid-row:1; grid-column:1/3; font-size:11px !important; white-space:nowrap; }
#fighterInsuranceWrap > div:first-of-type > span:nth-child(2),
#uncoveredComboWrap   > div:first-of-type > span:nth-child(2){ grid-row:1; grid-column:3/5; font-size:10px !important; white-space:nowrap; }
#fighterInsuranceWrap > div:first-of-type > span:nth-child(3),
#uncoveredComboWrap   > div:first-of-type > span:nth-child(3){ grid-row:1; grid-column:5; font-size:10px !important; white-space:nowrap; text-align:right; }

#fighterInsuranceWrap > div:first-of-type > span:nth-child(4),
#uncoveredComboWrap   > div:first-of-type > span:nth-child(4){ grid-row:2; grid-column:1; font-size:9.5px !important; letter-spacing:-0.5px; white-space:nowrap; }
#fiLottoCount,#uncoveredLottoCount{ grid-row:2; grid-column:2; width:100% !important; padding:2px 0 !important; font-size:10px !important; box-sizing:border-box; }
#fighterInsuranceWrap > div:first-of-type > button:nth-child(6),
#uncoveredComboWrap   > div:first-of-type > button:nth-child(6){ grid-row:2; grid-column:3; padding:4px 2px !important; font-size:9.5px !important; letter-spacing:-0.5px; white-space:nowrap; }
#fighterInsuranceWrap > div:first-of-type > button:nth-child(7),
#uncoveredComboWrap   > div:first-of-type > button:nth-child(7){ grid-row:2; grid-column:4; padding:4px 2px !important; font-size:9.5px !important; letter-spacing:-0.5px; white-space:nowrap; }

#fighterInsuranceWrap > div:first-of-type > span:nth-child(8),
#uncoveredComboWrap   > div:first-of-type > span:nth-child(8){
grid-row:2; grid-column:5;
display:flex !important; width:100%; margin-left:0 !important;
gap:2px !important; padding:2px 2px !important; box-sizing:border-box; min-width:0;
}
#uncoveredComboWrap > div:first-of-type > span:nth-child(8) > span{
display:flex !important; width:100%; min-width:0;
gap:2px !important; padding:2px 2px !important; box-sizing:border-box;
}
#fiAmtAutoBtn,#fiAmtManualBtn,#uncAmtAutoBtn,#uncAmtManualBtn{
padding:3px 7px !important; font-size:11px !important; letter-spacing:-0.3px;
white-space:nowrap; flex:0 0 auto; }
#fiAutoAmt,#fiManualAmt,#uncAutoAmt,#uncManualAmt{
width:44px !important; flex:0 1 44px; min-width:0;
font-size:10px !important; padding:3px 1px !important; box-sizing:border-box; }

/* 표: 좌우 잘림/스크롤 제거 */
#fighterInsuranceTable{ table-layout:fixed !important; width:100% !important; }
#fighterInsuranceScroll{ overflow-x:hidden !important; }
#fighterInsuranceTable th:nth-child(1),#fighterInsuranceBody td:nth-child(1){ width:24px !important; padding:2px 1px !important; font-size:10px !important; }
#fighterInsuranceTable th:nth-child(2),#fighterInsuranceBody td:nth-child(2){ width:56px !important; padding:2px 1px !important; font-size:11px !important; }
#fighterInsuranceTable th:nth-child(3),#fighterInsuranceBody td:nth-child(3){ width:auto !important; padding:2px 3px !important; font-size:11px !important; overflow:hidden; word-break:break-all; }
#fighterInsuranceTable th:nth-child(4),#fighterInsuranceBody td:nth-child(4){ width:68px !important; padding:2px 1px !important; font-size:10px !important; }
#fighterInsuranceScroll tbody td:nth-child(5),
#fighterInsuranceTable th:nth-child(5){ width:34px !important; padding:2px 1px !important; font-size:11px !important; }
#fighterInsuranceScroll tbody td:nth-child(6),
#fighterInsuranceTable th:nth-child(6){ width:46px !important; padding:2px 1px !important; font-size:11px !important; }
 

/* (구 규칙 삭제 — ws-fi-unc-mobile 에서 자동모드 방식으로 처리) */
#fighterInsuranceBody td:nth-child(2) input,
#fighterInsuranceBody td:nth-child(4) select,
#fighterInsuranceBody td:nth-child(4) input,
#fighterInsuranceBody td:nth-child(4) button{
width:100% !important; max-width:100% !important; box-sizing:border-box;
font-size:10px !important; padding:2px !important;
}
}


@media (max-width:768px){
#uncoveredComboWrap{ padding:10px 8px !important; }

/* 상단 컨트롤은 ws-fi-mobile 에서 승부사/미보험 공통 처리 */

/* 표: 좌우 잘림/스크롤 제거 */
#uncoveredComboTable{ table-layout:fixed !important; width:100% !important; }
#uncoveredComboScroll{ overflow-x:hidden !important; }
#uncoveredComboTable th:nth-child(1),#uncoveredComboBody td:nth-child(1){ width:24px !important; padding:2px 1px !important; font-size:10px !important; }
#uncoveredComboTable th:nth-child(2),#uncoveredComboBody td:nth-child(2){ width:56px !important; padding:2px 1px !important; font-size:11px !important; }
#uncoveredComboTable th:nth-child(3),#uncoveredComboBody td:nth-child(3){ width:auto !important; padding:2px 3px !important; font-size:11px !important; overflow:hidden; word-break:break-all; }
#uncoveredComboTable th:nth-child(4),#uncoveredComboBody td:nth-child(4){ width:68px !important; padding:2px 1px !important; font-size:10px !important; }
#uncoveredComboScroll tbody td:nth-child(5),
#uncoveredComboTable th:nth-child(5){ width:34px !important; padding:2px 1px !important; font-size:11px !important; }
#uncoveredComboScroll tbody td:nth-child(6),
#uncoveredComboTable th:nth-child(6){ width:46px !important; padding:2px 1px !important; font-size:11px !important; }


/* (구 규칙 삭제 — ws-fi-unc-mobile 에서 자동모드 방식으로 처리) */

#uncoveredComboBody td:nth-child(2) input,
#uncoveredComboBody td:nth-child(4) select,
#uncoveredComboBody td:nth-child(4) input{
width:100% !important; max-width:100% !important; box-sizing:border-box;
font-size:10px !important; padding:2px !important;
}
}

@media (max-width:768px){

#fighterInsuranceWrap, #uncoveredComboWrap{
max-width:100% !important; box-sizing:border-box !important; overflow-x:hidden !important; }
#fighterInsuranceScroll, #uncoveredComboScroll{
width:100% !important; max-width:100% !important; overflow-x:hidden !important; }

#fighterInsuranceScroll #fighterInsuranceTable,
#uncoveredComboScroll   #uncoveredComboTable{
table-layout:fixed !important; width:100% !important; min-width:0 !important; }

/* 칸 폭 : 자동모드와 동일 (26 / 58 / auto / 62 / 40 / 48) */
#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(1),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(1),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(1),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(1){
width:26px !important; padding:2px !important; min-width:0 !important; }

#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(2),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(2),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(2),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(2){
width:58px !important; padding:2px !important; }

#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(3),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(3),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(3),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(3){
width:auto !important; padding-left:4px !important; }
 
#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(4),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(4),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(4),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(4){
width:62px !important; padding:2px !important; }

#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(5),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(5),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(5),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(5){
width:40px !important; padding:2px !important; }

#fighterInsuranceScroll #fighterInsuranceTable th:nth-child(6),
#fighterInsuranceScroll #fighterInsuranceBody   td:nth-child(6),
#uncoveredComboScroll   #uncoveredComboTable    th:nth-child(6),
#uncoveredComboScroll   #uncoveredComboBody     td:nth-child(6){
width:48px !important; padding:2px !important; }

#fighterInsuranceScroll #fighterInsuranceBody td:nth-child(2) input,
#uncoveredComboScroll   #uncoveredComboBody   td:nth-child(2) input{
width:100% !important; max-width:100% !important; box-sizing:border-box !important; }

/* ══ 경기추가 슬롯 : 버튼 글자를 그대로 표시 ══ */
#fighterInsuranceScroll #fighterInsuranceBody td:nth-child(4) > div,
#uncoveredComboScroll   #uncoveredComboBody   td:nth-child(4) > div{
display:flex !important; flex-direction:column !important;
gap:3px !important; align-items:stretch !important; }

#fighterInsuranceScroll #fighterInsuranceBody td:nth-child(4) .fi-slot,
#uncoveredComboScroll   #uncoveredComboBody   td:nth-child(4) .unc-slot{
display:block !important;
width:100% !important; max-width:100% !important; min-width:0 !important;
box-sizing:border-box !important;
padding:5px 2px !important; line-height:1.25 !important;
font-size:10px !important; font-weight:700 !important;
white-space:normal !important; word-break:break-all !important;
text-align:center !important; }
}


/* ── 메인판 팀명 칸 ──────────────────────────────────── */

/* PC·모바일 공통 : 팀명만 …로 줄이고 승/무/패는 무조건 표시 */
#comboTable tbody td[id$="-name"]{ white-space:nowrap; overflow:hidden; }
#comboTable tbody td[id$="-name"] .ws-cellflex{
display:inline-flex;
align-items:center;
max-width:100%;
min-width:0;
vertical-align:middle;
}
#comboTable tbody td[id$="-name"] .ws-cellflex > .ws-tname{
flex:0 1 auto;
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
#comboTable tbody td[id$="-name"] .ws-cellflex > *:not(.ws-tname){
flex:0 0 auto;
white-space:pre;
}
/* ── 메인판 : 팀명과 기준점(승/무/패) 사이 한 칸 ── */
#comboTable tbody td[id$="-name"] .ws-tname{ margin-right: 0 !important; }
#comboTable tbody td[id$="-name"] .ws-tsuffix{ white-space: nowrap !important; }