/* Sudda Game - ink_layout Style */

.sudda_wrap {
	max-width: 100%;
	margin: 0 auto;
	font-family: 'NanumGothic', 'apple sd gothic neo', sans-serif;
	font-size: 14px;
	color: #222;
	line-height: 160%;
}
.sudda_wrap a { transition: color 0.3s; text-decoration: none; }
.sudda_wrap button { transition: color 0.3s, background-color 0.3s, border-color 0.3s; }

/* 헤더 */
.sudda_header {
	background: #fff;
	border: 1px solid #EEE;
	border-radius: 15px;
	padding: 20px 25px;
	margin-bottom: 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.sudda_title {
	font-size: 20px;
	font-weight: bold;
	color: #222;
}
.sudda_info {
	display: flex;
	gap: 20px;
	font-size: 13px;
}
.sudda_info_item {
	color: #666;
}
.sudda_info_item strong {
	color: #e74c3c;
	font-weight: bold;
}

/* 탭 네비게이션 */
.sudda_nav {
	display: flex;
	gap: 5px;
	margin-bottom: 15px;
}
.sudda_nav a {
	flex: 1;
	text-align: center;
	padding: 0;
	height: 42px;
	line-height: 42px;
	border-radius: 10px;
	background: #f7f7f7;
	color: #999;
	font-size: 14px;
	font-weight: bold;
	border: 1px solid #EEE;
}
.sudda_nav a:hover {
	color: #222;
	background: #EEE;
}
.sudda_nav a.active {
	color: #FFF;
	background: #6a96ff;
	border-color: #6a96ff;
}

/* 카드 보드 */
.sudda_board {
	background: #f7f7f7;
	border: 1px solid #EEE;
	border-radius: 15px;
	padding: 30px 20px;
	margin-bottom: 15px;
	text-align: center;
}
.sudda_teams {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 30px;
}
.sudda_team {
	text-align: center;
}
.sudda_team_label {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 12px;
	padding: 5px 18px;
	border-radius: 10px;
	display: inline-block;
	color: #FFF;
}
.sudda_team_label.blue {
	background: #6a96ff;
}
.sudda_team_label.red {
	background: #ff6868;
}
.sudda_cards {
	display: flex;
	gap: 10px;
	justify-content: center;
}
.sudda_vs {
	font-size: 24px;
	font-weight: bold;
	color: #BBB;
	align-self: center;
}

/* 카드 */
.card {
	width: 80px;
	height: 120px;
	perspective: 600px;
	cursor: default;
}
.card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
	transition: transform 0.6s ease;
}
.card.flipped .card-inner {
	transform: rotateY(180deg);
}
.card-front, .card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.card-back {
	border: 2px solid #EEE;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06);
	overflow: hidden;
}
.card-back img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px;
}
.card-front {
	background: #FFF;
	border: 2px solid #EEE;
	transform: rotateY(180deg);
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px;
}

/* 족보 표시 */
.sudda_hand {
	margin-top: 10px;
	font-size: 16px;
	font-weight: bold;
	min-height: 24px;
	opacity: 0;
	transition: opacity 0.3s;
}
.sudda_hand.show {
	opacity: 1;
}
.sudda_hand.blue {
	color: #6a96ff;
}
.sudda_hand.red {
	color: #ff6868;
}

/* 결과 오버레이 */
.sudda_result_overlay {
	display: none;
	text-align: center;
	padding: 25px;
	margin-bottom: 15px;
	border-radius: 15px;
	background: #FFF;
	border: 1px solid #EEE;
	box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.sudda_result_overlay.show {
	display: block;
}
.sudda_result_title {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 10px;
}
.sudda_result_title.win {
	color: #e74c3c;
}
.sudda_result_title.loss {
	color: #BBB;
}
.sudda_result_detail {
	font-size: 14px;
	color: #666;
	margin-bottom: 8px;
}
.sudda_result_point {
	font-size: 22px;
	font-weight: bold;
}
.sudda_result_point .up {
	color: #e74c3c;
}
.sudda_result_point .down {
	color: #2e86de;
}
.sudda_result_eo {
	font-size: 13px;
	color: #999;
	margin-top: 8px;
}

/* 베팅 패널 */
.sudda_bet_panel {
	padding: 25px;
	background: #FFF;
	border: 1px solid #EEE;
	border-radius: 15px;
	margin-bottom: 15px;
}
.sudda_bet_types {
	display: flex;
	gap: 8px;
	margin-bottom: 15px;
}
.sudda_bet_type_group {
	display: flex;
	gap: 8px;
	flex: 1;
}
.sudda_bet_type_group:last-child {
	border-left: 1px solid #EEE;
	padding-left: 8px;
}
.sudda_bet_btn {
	flex: 1;
	padding: 12px 8px;
	border: 1px solid #EEE;
	border-radius: 10px;
	background: #f7f7f7;
	color: #666;
	font-size: 13px;
	font-weight: bold;
	cursor: pointer;
	transition: all 0.3s;
	text-align: center;
}
.sudda_bet_btn:hover {
	background: #EEE;
	color: #222;
}
.sudda_bet_btn .odds {
	display: block;
	font-size: 11px;
	color: #BBB;
	margin-top: 3px;
}
.sudda_bet_btn.active .odds {
	color: inherit;
	opacity: 0.7;
}
.sudda_bet_btn.blue_btn.active { border-color: #6a96ff; background: #e9efff; color: #6a96ff; }
.sudda_bet_btn.red_btn.active { border-color: #ff6868; background: #ffe8e8; color: #ff6868; }
.sudda_bet_btn.draw_btn.active { border-color: #f39c12; background: #fef5e7; color: #f39c12; }
.sudda_bet_btn.even_btn.active { border-color: #4fd7c5; background: #e8faf7; color: #27ae60; }
.sudda_bet_btn.odd_btn.active { border-color: #9b59b6; background: #f4ecf7; color: #9b59b6; }

/* 금액 입력 */
.sudda_bet_amount {
	display: flex;
	gap: 8px;
	align-items: center;
	margin-bottom: 15px;
}
.sudda_bet_amount input {
	flex: 1;
	height: 42px;
	padding: 0 12px;
	background: #FFF;
	border: 1px solid #DDD;
	border-radius: 10px;
	color: #222;
	font-size: 16px;
	font-weight: bold;
	text-align: right;
	transition: background-color 0.3s;
}
.sudda_bet_amount input:focus {
	outline: none;
	background-color: #fcf8e3;
}
.sudda_quick_btns {
	display: flex;
	gap: 4px;
}
.sudda_quick_btn {
	height: 32px;
	line-height: 32px;
	padding: 0 11px;
	background: #f7f7f7;
	border: 1px solid #EEE;
	border-radius: 5px;
	color: #666;
	font-size: 13px;
	cursor: pointer;
	transition: all 0.3s;
}
.sudda_quick_btn:hover {
	background: #EEE;
	color: #222;
}

/* 예상 배당 & 베팅 버튼 */
.sudda_bet_footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.sudda_expected {
	font-size: 13px;
	color: #666;
}
.sudda_expected strong {
	color: #e74c3c;
	font-size: 16px;
}
.sudda_submit_btn {
	height: 42px;
	line-height: 42px;
	padding: 0 40px;
	background: #6a96ff;
	border: none;
	border-radius: 10px;
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
	transition: background-color 0.3s;
	position: relative;
	overflow: hidden;
}
.sudda_submit_btn:hover {
	background: #5580e8;
}
.sudda_submit_btn:disabled {
	background: #DDD;
	color: #999;
	cursor: not-allowed;
}

/* 안내 */
.sudda_guide {
	padding: 20px 25px;
	background: #FFF;
	border: 1px solid #EEE;
	border-radius: 15px;
	margin-bottom: 15px;
}
.sudda_guide_title {
	font-size: 14px;
	font-weight: bold;
	color: #222;
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid #EEE;
}
.sudda_guide p {
	font-size: 13px;
	color: #666;
	margin: 4px 0;
	line-height: 180%;
}

/* 로그인 필요 */
.sudda_login_msg {
	text-align: center;
	padding: 60px 20px;
	color: #999;
	font-size: 16px;
	background: #FFF;
	border: 1px solid #EEE;
	border-radius: 15px;
	margin-bottom: 15px;
}

/* 전적 테이블 */
.sudda_history_table {
	width: 100%;
	border-collapse: collapse;
	background: #FFF;
	border: 1px solid #EEE;
	border-radius: 10px;
	overflow: hidden;
}
.sudda_history_table th {
	background: #f7f7f7;
	padding: 10px 12px;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	color: #555;
	border-bottom: 1px solid #EEE;
}
.sudda_history_table td {
	padding: 10px 12px;
	font-size: 13px;
	text-align: center;
	border-bottom: 1px solid #f5f5f5;
}
.sudda_history_table .up { color: #e74c3c; }
.sudda_history_table .down { color: #2e86de; }

/* 페이지네이션 */
.sudda_pagination {
	text-align: center;
	padding: 20px;
}
.sudda_pagination a, .sudda_pagination strong {
	display: inline-block;
	height: 32px;
	line-height: 32px;
	padding: 0 11px;
	margin: 0 2px;
	border-radius: 5px;
	text-decoration: none;
	font-size: 13px;
}
.sudda_pagination a {
	color: #666;
	background: #f7f7f7;
	border: 1px solid #EEE;
}
.sudda_pagination a:hover {
	background: #EEE;
	color: #222;
}
.sudda_pagination strong {
	color: #FFF;
	background: #6a96ff;
}

/* 오늘의 랭킹 */
.sudda_ranking_wrap {
	display: flex;
	gap: 15px;
	margin-bottom: 15px;
}
.sudda_ranking_box {
	flex: 1;
	background: #FFF;
	border: 1px solid #EEE;
	border-radius: 15px;
	overflow: hidden;
}
.sudda_ranking_title {
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	border-bottom: 1px solid #EEE;
}
.sudda_ranking_title.winner {
	color: #e74c3c;
}
.sudda_ranking_title.loser {
	color: #2e86de;
}
.sudda_ranking_table {
	width: 100%;
	border-collapse: collapse;
}
.sudda_ranking_table th {
	background: #f7f7f7;
	padding: 8px 12px;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	color: #555;
	border-bottom: 1px solid #EEE;
}
.sudda_ranking_table td {
	padding: 9px 12px;
	font-size: 13px;
	text-align: center;
	border-bottom: 1px solid #f5f5f5;
}
.sudda_ranking_table td strong {
	color: #6a96ff;
}
.sudda_ranking_table .up { color: #e74c3c; font-weight: bold; }
.sudda_ranking_table .down { color: #2e86de; font-weight: bold; }
.sudda_ranking_empty {
	padding: 25px !important;
	color: #999 !important;
	font-size: 13px !important;
}

/* ===== 다크모드 ===== */
.color_scheme_dark .sudda_wrap { color: #ddd; }

/* 헤더 */
.color_scheme_dark .sudda_header { background: #1e1e1e; border-color: #333; }
.color_scheme_dark .sudda_title { color: #eee; }
.color_scheme_dark .sudda_info_item { color: #999; }

/* 네비게이션 */
.color_scheme_dark .sudda_nav a { background: #1e1e1e; color: #888; border-color: #333; }
.color_scheme_dark .sudda_nav a:hover { background: #2a2a2a; color: #ddd; }
.color_scheme_dark .sudda_nav a.active { background: #6a96ff; color: #fff; border-color: #6a96ff; }

/* 카드 보드 */
.color_scheme_dark .sudda_board { background: #1a1a1a; border-color: #333; }
.color_scheme_dark .sudda_vs { color: #555; }

/* 카드 */
.color_scheme_dark .card-back { border-color: #444; box-shadow: 0 2px 8px rgba(0,0,0,0.3); }
.color_scheme_dark .card-front { background: #2a2a2a; border-color: #444; box-shadow: 0 2px 8px rgba(0,0,0,0.3); }

/* 결과 오버레이 */
.color_scheme_dark .sudda_result_overlay { background: #1e1e1e; border-color: #333; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.color_scheme_dark .sudda_result_title.loss { color: #888; }
.color_scheme_dark .sudda_result_detail { color: #999; }
.color_scheme_dark .sudda_result_eo { color: #777; }

/* 베팅 패널 */
.color_scheme_dark .sudda_bet_panel { background: #1e1e1e; border-color: #333; }
.color_scheme_dark .sudda_bet_type_group:last-child { border-left-color: #333; }
.color_scheme_dark .sudda_bet_btn { background: #2a2a2a; border-color: #333; color: #999; }
.color_scheme_dark .sudda_bet_btn:hover { background: #333; color: #ddd; }
.color_scheme_dark .sudda_bet_btn .odds { color: #666; }
.color_scheme_dark .sudda_bet_btn.blue_btn.active { background: #1a2744; color: #6a96ff; border-color: #6a96ff; }
.color_scheme_dark .sudda_bet_btn.red_btn.active { background: #3a1a1a; color: #ff6868; border-color: #ff6868; }
.color_scheme_dark .sudda_bet_btn.draw_btn.active { background: #3a2e10; color: #f39c12; border-color: #f39c12; }
.color_scheme_dark .sudda_bet_btn.even_btn.active { background: #0f2e28; color: #4fd7c5; border-color: #4fd7c5; }
.color_scheme_dark .sudda_bet_btn.odd_btn.active { background: #2a1a33; color: #b87fd8; border-color: #9b59b6; }

/* 금액 입력 */
.color_scheme_dark .sudda_bet_amount input { background: #2a2a2a; border-color: #444; color: #eee; }
.color_scheme_dark .sudda_bet_amount input:focus { background-color: #332e1a; }
.color_scheme_dark .sudda_quick_btn { background: #2a2a2a; border-color: #333; color: #999; }
.color_scheme_dark .sudda_quick_btn:hover { background: #333; color: #ddd; }

/* 베팅 하단 */
.color_scheme_dark .sudda_expected { color: #999; }
.color_scheme_dark .sudda_submit_btn:disabled { background: #333; color: #666; }

/* 안내 */
.color_scheme_dark .sudda_guide { background: #1e1e1e; border-color: #333; }
.color_scheme_dark .sudda_guide_title { color: #ddd; border-bottom-color: #333; }
.color_scheme_dark .sudda_guide p { color: #999; }

/* 로그인 */
.color_scheme_dark .sudda_login_msg { background: #1e1e1e; border-color: #333; color: #777; }

/* 전적 테이블 */
.color_scheme_dark .sudda_history_table { background: #1e1e1e; border-color: #333; }
.color_scheme_dark .sudda_history_table th { background: #252525; color: #999; border-bottom-color: #333; }
.color_scheme_dark .sudda_history_table td { color: #ccc; border-bottom-color: #2a2a2a; }

/* 페이지네이션 */
.color_scheme_dark .sudda_pagination a { background: #1e1e1e; border-color: #333; color: #999; }
.color_scheme_dark .sudda_pagination a:hover { background: #2a2a2a; color: #ddd; }

/* 오늘의 랭킹 */
.color_scheme_dark .sudda_ranking_box { background: #1e1e1e; border-color: #333; }
.color_scheme_dark .sudda_ranking_title { border-bottom-color: #333; }
.color_scheme_dark .sudda_ranking_table th { background: #252525; color: #999; border-bottom-color: #333; }
.color_scheme_dark .sudda_ranking_table td { color: #ccc; border-bottom-color: #2a2a2a; }

/* 반응형 */
@media (max-width: 640px) {
	.sudda_header {
		flex-direction: column;
		gap: 10px;
		text-align: center;
		padding: 15px;
		border-radius: 10px;
	}
	.sudda_board {
		padding: 20px 10px;
		border-radius: 10px;
	}
	.sudda_teams {
		gap: 15px;
	}
	.card {
		width: 65px;
		height: 100px;
	}
	.sudda_vs {
		font-size: 20px;
	}
	.sudda_bet_panel {
		padding: 15px;
		border-radius: 10px;
	}
	.sudda_bet_types {
		flex-direction: column;
	}
	.sudda_bet_type_group {
		flex: auto;
	}
	.sudda_bet_type_group:last-child {
		border-left: none;
		padding-left: 0;
		border-top: 1px solid #EEE;
		padding-top: 8px;
	}
	.color_scheme_dark .sudda_bet_type_group:last-child {
		border-top-color: #333;
	}
	.sudda_bet_footer {
		flex-direction: column;
		gap: 12px;
	}
	.sudda_submit_btn {
		width: 100%;
	}
	.sudda_nav a {
		height: 36px;
		line-height: 36px;
		font-size: 13px;
		border-radius: 5px;
	}
	.sudda_guide, .sudda_login_msg, .sudda_result_overlay {
		border-radius: 10px;
	}
	.sudda_ranking_wrap {
		flex-direction: column;
	}
	.sudda_ranking_box {
		border-radius: 10px;
	}
}