.btn.btn-primary {
	background: var(--scl-primary) !important;
    border: none !important;
    border-radius: 11px !important;
    font-weight: 600;
    padding: 10px 16px !important;
    box-shadow: 0 4px 12px rgba(11, 110, 143, .28);
}

.activityList {
	padding-top:2em;

	display: grid;
	gap: 16px;
	margin-top: 8px;
	grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
}

.activityList > div {
	padding-bottom:5em;
	padding:10px;

	background: #FFF;
	border: 1px solid #eee;
	border-radius: 15px;
	box-shadow: var(--scl-shadow);
	vertical-align:top;

	display: flex;
	flex-direction: column;
	overflow: hidden;

	position:relative;
}

.activityList > div:hover {
	border: 1px solid var(--scl-primary);
}

.content .activityList > div::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(90deg, var(--scl-primary), var(--scl-accent));
}

.activityList .title {
	border-bottom: solid 1px #EEE;
	padding-bottom: 10px;
	margin-bottom: 10px;
	padding-left: 90px;
	padding-top: 7px;
	height: 150px;
}

.activityList .title a {
	font-size:1.7em;
	color:#222;
	font-weight:600;
	line-height: 1.2;
}

.activityList .title .place {
	display:block;
	font-size:0.8em;
	padding-top:5px;
}

.activityList .date {
	position:absolute;
}

.activityList .date a {
	font-size:0.8em;
	color:#111;
	display:inline-block;
	text-align:center;
	border:1px solid #CCC;
	border-radius:10px;
	background:var(--scl-surface-2);
	padding:10px;
	width:80px;
}

.activityList .date a span.num {
	font-size:2em;
	font-weight:600;
	display:block;
	color:#222;
}

.activityList .date a span.year {
	display:block;
}

.activityList .date a span.hour {
	font-size:1.5em;
	font-weight:600;
	display:block;
	padding-top:5px;
	border-top:1px solid #CCC;
	margin-top:5px;
}

.activityList .price {
	display:inline-block;
	font-size:1.5em;
	font-weight:bold;

	position:absolute;
	padding:10px 15px;
	border:1px solid #EEE;
	border-radius:50px;
	right:10px;
	background: #FFF;
	top: 130px;
	color:#222;
	box-shadow: var(--scl-shadow);
}

.activityList .id {
	font-size:0.8em;
	color:#999;
	position:absolute;
	right:10px;
}

.activityList .noCaci {
	font-weight:bold !important;
	color:#FC0;
}

.activityList .expCaci {
	font-weight:bold !important;
	color:#C00;
}

.activityList .userList {
	padding-bottom:0;
	min-height: 200px;
}

.activityList .userList:hover {
	background:none;
}

.activityList .userList .p-hidden {
	display: none !important;
}

.activityList .pilote {
	padding:15px 0 10px;
}

.activityList .actions {
	padding-top:1em;
}

.activityList .actions a {
	display: inline-block;
	padding: 8px 16px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 4px;
	background:#EEE;
}


/* nb participants → ligne de compteur (+ jauge ajoutée par le JS) */
.activityList .nb{
	font-size:13.5px;font-weight:600;color:var(--scl-ink);margin-bottom:4px;
}
.activityList .nb b{font-weight:600;color:var(--scl-muted);font-variant-numeric:tabular-nums}
.activityList .nb-bar{
	height:8px;border-radius:99px;background:var(--scl-surface-2);
	border:1px solid var(--scl-line);overflow:hidden;margin:0 0 12px;
}
.activityList .nb-bar > i{
	display:block;height:100%;border-radius:99px;background:var(--scl-ok);transition:width .4s ease;
}
.activityList .nb-bar.near > i{background:var(--scl-warn)}
.activityList .nb-bar.full > i{background:var(--scl-danger)}

.activityList .showMore{
  margin-top:10px;
  border:1px solid #EEE;
  background:#FFF;
  color:#999;
  font-weight:600;
  font-size:13px;
  border-radius:10px;
  padding:8px 13px;
  cursor:pointer;
  transition:background .15s;
}
.activityList .showMore:hover{
	background:#EEE;
	color:#333;
}

.userList.mini {

}

.userList.mini > div {
	margin-bottom:3px;
	padding:7px 10px;
	border:1px solid #EEE;
	border-radius:10px;
	position:relative;
}

.userList.mini > div:has(.monitor) {
	border-color:var(--scl-primary);
}

.userList.mini > div .monitor {
	display:inline-block;
	color: #fff !important;
    background: var(--scl-primary) !important;
    border: none !important;
    font-size: 9.5px !important;
    letter-spacing: .03em;
    text-transform: uppercase;
	padding:2px 5px;
	border-radius:5px;
	position:absolute;
	right:10px;
}

.userList.mini > div .dp {
	display:inline-block;
	color: #fff !important;
    background: #999 !important;
    border: none !important;
    font-size: 9.5px !important;
    letter-spacing: .03em;
    text-transform: uppercase;
	padding:2px 5px;
	border-radius:5px;
	margin-left:5px;
}

.userList.mini > div .level {
	display:inline-block;
	padding:2px 5px;
	border-radius:5px;
	border:solid 1px #EEE;
	margin-left:5px;
}