/* ============================================
   사커스타 CSS 폴리시 (오버레이)
   v1.0 - 2026-03-19

   원본 mobile_css.css를 수정하지 않고
   위에서 덮어쓰는 방식입니다.
   롤백: 이 파일 include만 제거하면 원복.
   ============================================ */

/* === CSS 변수 === */
:root {
    --ss-primary: #00C908;
    --ss-primary-dark: #00a806;
    --ss-accent: #9575cd;
    --ss-accent-dark: #7e57c2;
    --ss-danger: #db0000;
    --ss-blue: #007ae1;
    --ss-green-text: #55be00;
    --ss-text: #333333;
    --ss-text-secondary: #666666;
    --ss-text-light: #999999;
    --ss-border: rgba(128,128,128,0.15);
    --ss-border-strong: #c7c7c7;
    --ss-bg: #ffffff;
    --ss-bg-alt: #f5f5f5;
    --ss-bg-hover: #f9f9fb;
    --ss-shadow: 0 2px 8px rgba(0,0,0,0.06);
    --ss-shadow-hover: 0 4px 12px rgba(0,0,0,0.1);
    --ss-radius: 8px;
    --ss-radius-sm: 6px;
    --ss-transition: 0.15s ease;
}

/* === 카드/박스 === */
.outbox {
    border-radius: var(--ss-radius) !important;
    border-color: var(--ss-border) !important;
    box-shadow: var(--ss-shadow) !important;

}

/* === 서브 탭 메뉴 === */
.tab_u {
    border-color: var(--ss-border) !important;
    border-radius: var(--ss-radius) var(--ss-radius) 0 0 !important;
    overflow: hidden;
}
.tab_a {
    height: 36px !important;
    line-height: 36px !important;
    font-size: 13px !important;
    border-color: var(--ss-border) !important;
    transition: background var(--ss-transition), color var(--ss-transition);
}
.tab_lon .tab_a {
    background: var(--ss-accent) !important;
    background-image: none !important;
    filter: none !important;
    border-color: var(--ss-accent-dark) !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* === 섹션 타이틀 바 === */
.ranking_title,
.ranking2_title,
.ranking_plr_title {
    height: 42px !important;
    line-height: 42px !important;
    border-bottom: 1px solid var(--ss-border) !important;
}
.ranking_title_txt, .player_title_txt,
.ranking2_title_txt, .player2_title_txt,
.ranking_plr_title_txt {
    font-size: 14px !important;
}

/* === 리스트 행 (선수, 랭킹 등) === */
.ranking_list,
.ranking2_list,
.ranking_plr_list {
    background-color: transparent !important;
    border-bottom: 1px solid rgba(128,128,128,0.12) !important;
}
.ranking_list.hand:active {
    background-color: rgba(128,128,128,0.06) !important;
}
/* 선수 리스트 컬럼 - 색상은 테마에 맡김 */
.ranking_list_1, .ranking_list_2, .ranking_list_3,
.ranking_list_4, .ranking_list_5, .ranking_list_6,
.ranking2_list_1, .ranking2_list_2, .ranking2_list_3,
.ranking2_list_4, .ranking2_list_5, .ranking2_list_6 {
    color: inherit !important;
}
/* 타이틀 행 배경 투명화 */
.ranking_title {
    background-color: rgba(128,128,128,0.06) !important;
}



/* === 버튼 (그린) === */
.comment_tit_btn {
    height: 36px !important;
    line-height: 36px !important;
    font-size: 15px !important;
    border-radius: var(--ss-radius-sm) !important;
    background: var(--ss-primary) !important;
    background-image: none !important;
    filter: none !important;
    border: 1px solid var(--ss-primary-dark) !important;
    text-shadow: none !important;
    box-shadow: var(--ss-shadow) !important;
    transition: background var(--ss-transition), box-shadow var(--ss-transition);
}
.comment_tit_btn:active {
    background: var(--ss-primary-dark) !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15) !important;
}

/* === 버튼 (전체 너비) === */
.all_button {
    height: 44px !important;
    line-height: 44px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: var(--ss-radius-sm) !important;
    border: 1px solid var(--ss-border) !important;
    box-shadow: var(--ss-shadow) !important;
    margin-bottom: 8px !important;
    transition: background var(--ss-transition), box-shadow var(--ss-transition);
}
.all_button:active {
    background: rgba(0,0,0,0.05) !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.08) !important;
}
.all_button font {
    color: var(--ss-danger) !important;
}

/* === 버튼 (컵 참가 등 작은 버튼) === */
.cup_go {
    padding: 4px 10px !important;
    font-size: 12px !important;
    border-radius: var(--ss-radius-sm) !important;
    background-color: #772C3E !important;
    border-color: #a36161 !important;
    transition: background var(--ss-transition);
}
.cup_go:active {
    background-color: #5e2232 !important;
}

/* === 전술 버튼 === */
.tactics_button,
.tactics_button2,
.btn2ea_btn {
    height: 34px !important;
    line-height: 34px !important;
    border-radius: var(--ss-radius-sm) !important;
    font-size: 13px !important;
    transition: background var(--ss-transition);
}

/* === 게시판 === */
.board_title {
    height: 40px !important;
}
.board_contents {
    border-radius: 0 0 var(--ss-radius) var(--ss-radius) !important;
    line-height: 1.6 !important;
    font-size: 14px !important;
}

/* === 댓글 === */
.comment_list {
    font-size: 14px !important;
    padding: 10px 12px !important;
    border-bottom: 1px solid rgba(128,128,128,0.12) !important;
}
.comment_name {
    font-size: 14px !important;
}

/* === 메인 프로필 === */
.main_p_img {
    border-radius: 50% !important;
    border-color: #ddd !important;
}
.main_p_team {
    font-size: 18px !important;
}
.main_p_txt {
    font-size: 13px !important;
    line-height: 1.5 !important;
}
.main_p_2 {
    border-radius: 0 0 var(--ss-radius) var(--ss-radius) !important;
}

/* === 팀 이름 === */
.my_team_name {
    font-size: 18px !important;
    padding: 16px 12px !important;
}
.my_team_name font {
    font-size: 11px !important;
}

/* === 상점 아이템 카드 === */
.shop_lst_box {
    border-bottom: 1px solid rgba(128,128,128,0.12) !important;
    padding: 12px 0 !important;
    transition: background var(--ss-transition);
}
.shop_lst_tit {
    font-size: 15px !important;
    font-weight: 600 !important;
}
.shop_lst_sub1 {
    font-size: 13px !important;
    line-height: 1.4 !important;
}
.shop_lst_sub1 span {
    border-radius: var(--ss-radius-sm) !important;
}

/* === 입력 필드 === */
TEXTAREA {
    border-radius: var(--ss-radius-sm) !important;
    border-color: var(--ss-border) !important;
    font-size: 14px !important;
    padding: 8px !important;
    transition: border-color var(--ss-transition);
}
TEXTAREA:focus {
    border-color: var(--ss-primary) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 201, 8, 0.15) !important;
}

/* === 네비게이션 === */
.nav {
    border-bottom-color: var(--ss-border) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.nav_l {
    font-size: 15px !important;
}
.nav_put {
    border-bottom: 3px solid var(--ss-accent) !important;
    color: var(--ss-accent-dark) !important;
    font-weight: 700 !important;
}

/* === 헤더 === */
.top {
    border-bottom-color: var(--ss-border) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

/* === 게임 경기 === */
.gameg {
    border-bottom: 1px solid rgba(128,128,128,0.12) !important;
}
.gameg_enter {
    border-radius: var(--ss-radius-sm) !important;
}

/* === 시작 버튼 (초록 큰 버튼) === */
.t_start {
    border-radius: var(--ss-radius-sm) !important;
    background: var(--ss-primary) !important;
    background-image: none !important;
    filter: none !important;
    transition: background var(--ss-transition);
}
.t_start:active {
    background: var(--ss-primary-dark) !important;
}

/* === 스크롤바 (웹킷) === */
::-webkit-scrollbar {
    width: 4px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}

/* === 다크 테마 호환 ===
   다크 테마는 new_header.css에서 배경을 어둡게 변경.
   여기서는 밝은 색상 강제 지정을 피하고,
   !important로 덮어쓸 때 다크 배경에서도 깨지지 않도록 처리. === */

/* 리스트 행 hover/active - 다크에서도 동작하도록 반투명 */

/* 버튼 active - 다크에서도 동작 */
.all_button:active {
    background: rgba(0,0,0,0.05) !important;
}

/* 입력 필드 포커스 - 다크에서도 동작 */
TEXTAREA:focus {
    box-shadow: 0 0 0 2px rgba(0, 201, 8, 0.2) !important;
}

/* === 리그 순위 테이블 정렬 개선 === */
/* 구조: [순위] [상승하락+엠블럼] [팀명] [승][무][패][득][실][승점] */
.teamrank,
.teamrank2 {
    display: flex !important;
    align-items: center !important;
    padding: 6px 8px !important;
    min-height: 40px !important;
    line-height: normal !important;
    border-bottom: 1px solid rgba(128,128,128,0.15) !important;
}
.teamrank_tit {
    display: flex !important;
    align-items: center !important;
    padding: 6px 8px !important;
    min-height: 36px !important;
    line-height: normal !important;
}

/* 순위 번호 */
.teamrank_num {
    float: none !important;
    position: static !important;
    left: auto !important;
    margin: 0 !important;
    width: 24px !important;
    min-width: 24px !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}
.teamrank_tit_num {
    float: none !important;
    position: static !important;
    left: auto !important;
    margin: 0 !important;
    width: 24px !important;
    min-width: 24px !important;
    text-align: center !important;
    font-size: 11px !important;
}

/* 엠블럼 (상승/하락 아이콘 + 엠블럼 이미지 포함) */
/* 이 칸에 상승/하락 font + 엠블럼 img가 함께 있음 */
.teamrank_emb {
    float: none !important;
    position: static !important;
    left: auto !important;
    margin: 0 !important;
    width: 42px !important;
    min-width: 42px !important;
    text-align: center !important;
    vertical-align: middle !important;
    font-size: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
}
.teamrank_emb img {
    width: 18px !important;
    height: 18px !important;
    vertical-align: middle !important;
    object-fit: contain !important;
}
/* 인라인 스타일 override */
li.teamrank_emb[style] {
    position: static !important;
    left: auto !important;
}

/* 팀명 - 엠블럼 바로 옆에 붙음 */
.teamrank_team {
    float: none !important;
    position: static !important;
    left: auto !important;
    flex: 1 !important;
    width: auto !important;
    text-align: left !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 0 4px !important;
}
/* 팀명 인라인 스타일 override */
li.teamrank_team[style] {
    position: static !important;
    left: auto !important;
}
.teamrank_tit_team {
    float: none !important;
    position: static !important;
    flex: 1 !important;
    width: auto !important;
    text-align: center !important;
    font-size: 11px !important;
}

/* 승/무/패/득/실/승점 공통 */
.teamrank_win, .teamrank_draw, .teamrank_lose,
.teamrank_goal, .teamrank_ngoal, .teamrank_total {
    float: none !important;
    position: static !important;
    left: auto !important;
    margin: 0 !important;
    width: 24px !important;
    min-width: 24px !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}
.teamrank_tit_win, .teamrank_tit_draw, .teamrank_tit_lose,
.teamrank_tit_goal, .teamrank_tit_ngoal, .teamrank_tit_total {
    float: none !important;
    position: static !important;
    left: auto !important;
    margin: 0 !important;
    width: 24px !important;
    min-width: 24px !important;
    text-align: center !important;
    font-size: 10px !important;
}

/* 승점 약간 강조 */
.teamrank_total {
    width: 28px !important;
    min-width: 28px !important;
}
.teamrank_tit_total {
    width: 28px !important;
    min-width: 28px !important;
}

/* === 포인트/승점 컬러 개선 === */
/* 기존 #55be00(녹색) → 퍼플/바이올렛 (다크 테마와 조화) */
.teamrank_total {
    color: #a98eda !important;
}
.ranking_list_6,
.ranking2_list_6,
.ranking_plr_list_6 {
    color: #a98eda !important;
}
/* 메인 프로필 포인트 바 */
.main_p_bottom_l,
.main_p_bottom_r {
    color: #c5b9d9 !important;
}
/* 선수 능력치 포인트 */
.p_info_l_num,
.p_info_r_num {
    color: #a98eda !important;
}

/* === 녹색 → 퍼플 전체 통일 === */
/* 탭 첫번째 자식도 퍼플 */
.tab_lon:first-child .tab_a {
    border-color: var(--ss-accent-dark) !important;
}

/* 그린 버튼 (.comment_tit_btn) → 퍼플 */
.comment_tit_btn {
    background: var(--ss-accent) !important;
    border-color: var(--ss-accent-dark) !important;
    border-top-color: var(--ss-accent) !important;
}
.comment_tit_btn:active {
    background: var(--ss-accent-dark) !important;
}

/* 시작/매치 버튼 → 퍼플 */
.t_start {
    background: var(--ss-accent) !important;
}
.t_start:active {
    background: var(--ss-accent-dark) !important;
}

/* 메인 프로필 바 */
.main_p_2 {
    background-color: var(--ss-accent) !important;
}

/* 컵 대회 텍스트 */
.cup_2 {
    color: var(--ss-accent) !important;
}

/* 네비게이션 활성 폰트 컬러 */
.nav_put a {
    color: var(--ss-accent-dark) !important;
}

/* 게시판/코칭 숫자 포인트 */
.co_name2_num,
.co_name_num,
.brd_w_con {
    color: #a98eda !important;
}

/* 입력 필드 포커스 테두리 → 퍼플 */
TEXTAREA:focus {
    box-shadow: 0 0 0 2px rgba(124, 77, 255, 0.2) !important;
}

/* === 목록 구분선 부드럽게 === */
/* 기존 #e4e5e7 흰색 구분선 → 반투명으로 다크/라이트 모두 자연스럽게 */
.ranking_list,
.ranking2_list,
.ranking_plr_list,
.board_title,
.comment_list_msgright {
    border-bottom: 1px solid rgba(128,128,128,0.12) !important;
}
.ranking_list2,
.ranking2_list2 {
    border-bottom: 1px solid rgba(128,128,128,0.08) !important;
}
/* outbox 테두리 */
.outbox {
    border-color: rgba(128,128,128,0.15) !important;
}
/* 탭 테두리 */
.tab_u {
    border-color: rgba(128,128,128,0.15) !important;
}
.tab_a {
    border-color: rgba(128,128,128,0.12) !important;
}
/* 헤더/네비게이션 하단선 */
.top {
    border-bottom-color: rgba(128,128,128,0.15) !important;
}
.nav {
    border-bottom-color: rgba(128,128,128,0.15) !important;
}


/* === 리스트 텍스트 수직 중앙 보정 === */
/* 원본 float+line-height 방식에서 이미지와 텍스트가 섞이면 약간 위로 쏠림 */
.ranking_list,
.ranking2_list,
.ranking_plr_list {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    height: 40px !important;
}
/* float 해제 (flex와 충돌 방지) */
.ranking_list > li,
.ranking2_list > li,
.ranking_plr_list > li {
    float: none !important;
    line-height: normal !important;
}

/* === 게시판 버튼 중앙 정렬 + 정리 === */
ul.ranking_list.tactics_list {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 12px !important;
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 50px !important;
    line-height: normal !important;
    text-align: center !important;
}
.tactics_button,
.tactics_button2 {
    border-radius: var(--ss-radius-sm) !important;
    background: none !important;
    background-image: none !important;
    filter: none !important;
    background-color: rgba(128,128,128,0.1) !important;
    border: 1px solid rgba(128,128,128,0.2) !important;
    text-shadow: none !important;
    font-size: 12px !important;
    height: 34px !important;
    line-height: 34px !important;
    padding: 0 14px !important;
    width: auto !important;
}
.tactics_button_put {
    background: var(--ss-accent) !important;
    background-image: none !important;
    filter: none !important;
    border-color: var(--ss-accent-dark) !important;
    color: #fff !important;
    text-shadow: none !important;
}
