.kcfgwc-webclap {
	margin: 1em 0;
	position: relative;
}
.kcfgwc-webclap .btn {
	cursor: pointer;
	padding: .5em 1.2em;
	border-radius: 4px;
	border: 1px solid #ccc;
	background: #f7f7f7;
	font-size: 1em;
}
.kcfgwc-webclap .btn-primary  { background: #3D75E5; color: #fff; border-color: #3D75E5; }
.kcfgwc-webclap .btn-success  { background: #4caf50; color: #fff; border-color: #4caf50; }
.kcfgwc-webclap .btn-info     { background: #2196f3; color: #fff; border-color: #2196f3; }
.kcfgwc-webclap .btn-warning  { background: #ff9800; color: #fff; border-color: #ff9800; }
.kcfgwc-webclap .btn-danger   { background: #ED4040; color: #fff; border-color: #ED4040; }
.kcfgwc-webclap .btn:disabled { opacity: .6; cursor: default; }
.kcfgwc-webclap .count        { font-weight: bold; margin-left: .3em; }
.kcfgwc-webclap .balloon      { display: inline-block; margin-left: .5em; padding: .1em .6em; border-radius: 999px; background: #eee; }

.kcfgwc-thanks-popup {
	position: absolute;
	z-index: 9999;
	width: 300px;
	max-width: 90vw;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .15);
	padding: 1em;
}
.kcfgwc-thanks-popup .kcfgwc-popup-close {
	position: absolute;
	top: -10px;
	right: -10px;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: none;
	background: #333;
	color: #fff;
	cursor: pointer;
	line-height: 1;
}
.kcfgwc-thanks-popup .kcfgwc-thanks-msg { margin: 0 0 .8em; }
.kcfgwc-thanks-popup select,
.kcfgwc-thanks-popup input[type="text"],
.kcfgwc-thanks-popup textarea {
	width: 100%;
	box-sizing: border-box;
	margin-bottom: .6em;
	padding: .5em;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: .95em;
}
.kcfgwc-thanks-popup textarea { min-height: 5em; resize: vertical; }
.kcfgwc-thanks-popup .kcfgwc-recaptcha { margin-bottom: .6em; }

.kcfgwc-ranking-navi { margin-bottom: .5em; font-size: .9em; }
.kcfgwc-ranking-navi .item { cursor: pointer; }
.kcfgwc-ranking-navi .item.active { font-weight: bold; text-decoration: underline; }
.kcfgwc-ranking-table .tr {
	display: flex;
	align-items: center;
	gap: .5em;
	padding: .3em 0;
	border-bottom: 1px solid #eee;
}
.kcfgwc-ranking-table .column-rank  { width: 2em; text-align: center; }
.kcfgwc-ranking-table .column-count { width: 3em; text-align: right; }
.kcfgwc-ranking-table .column-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kcfgwc-ranking-table .thead .tr { border-bottom: 2px solid #ddd; font-weight: bold; font-size: .9em; color: #666; }

/* カラーリング(順位・拍手数の文字色): ウィジェット設定で選べる配色 */
.kcfgwc-ranking-table.color-primary .kcfgwc-ranking-body .column-rank,
.kcfgwc-ranking-table.color-primary .kcfgwc-ranking-body .column-count { color: #3D75E5; }
.kcfgwc-ranking-table.color-success .kcfgwc-ranking-body .column-rank,
.kcfgwc-ranking-table.color-success .kcfgwc-ranking-body .column-count { color: #4caf50; }
.kcfgwc-ranking-table.color-info .kcfgwc-ranking-body .column-rank,
.kcfgwc-ranking-table.color-info .kcfgwc-ranking-body .column-count { color: #2196f3; }
.kcfgwc-ranking-table.color-warning .kcfgwc-ranking-body .column-rank,
.kcfgwc-ranking-table.color-warning .kcfgwc-ranking-body .column-count { color: #ff9800; }
.kcfgwc-ranking-table.color-danger .kcfgwc-ranking-body .column-rank,
.kcfgwc-ranking-table.color-danger .kcfgwc-ranking-body .column-count { color: #ED4040; }

.kcfgwc-clap-list .clap { padding: .4em 0; border-bottom: 1px solid #eee; }
.kcfgwc-clap-list .date { font-size: .85em; color: #888; }
