/* =========================================================
   WC Points & Rewards Pro — Front-office styles
   ========================================================= */

/* --- Solde & badge niveau --- */
.wcpr-balance { font-weight: 600; color: #2c6fad; }

.wcpr-level-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 20px;
	font-size: 0.8em;
	font-weight: 700;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,.3);
	letter-spacing: .5px;
}

/* --- Tableau historique --- */
.wcpr-history { margin: 1.5em 0; }

.wcpr-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9em;
}
.wcpr-table th,
.wcpr-table td {
	padding: 8px 12px;
	border: 1px solid #e2e4e7;
	text-align: left;
}
.wcpr-table thead th { background: #f7f7f7; font-weight: 600; }
.wcpr-table .wcpr-positive td { background: #f0fff4; }
.wcpr-table .wcpr-negative td { background: #fff5f5; }
.wcpr-table .wcpr-expired td  { opacity: .6; text-decoration: line-through; }
.wcpr-pts { font-weight: 700; text-align: right; }

.wcpr-tag {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 12px;
	font-size: .78em;
	font-weight: 600;
}
.wcpr-tag.active  { background: #d4edda; color: #155724; }
.wcpr-tag.expired { background: #f8d7da; color: #721c24; }
.wcpr-balance-summary { font-size: 1.05em; margin-bottom: 1em; }

/* --- Parrainage --- */
.wcpr-referral-box { background: #f9f9f9; border: 1px solid #ddd; border-radius: 6px; padding: 16px; margin: 1em 0; }
.wcpr-referral-url-wrap { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.wcpr-referral-url { flex: 1; padding: 6px 10px; border: 1px solid #ccc; border-radius: 4px; font-size: .9em; }
.wcpr-copy-btn { padding: 6px 14px; cursor: pointer; }

/* --- Partage social --- */
.wcpr-social-share { margin: 1em 0; }
.wcpr-share-btn {
	display: inline-block;
	margin: 4px 4px 4px 0;
	padding: 8px 16px;
	border-radius: 4px;
	color: #fff !important;
	font-size: .85em;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: opacity .2s;
}
.wcpr-share-btn:hover     { opacity: .85; }
.wcpr-share-facebook      { background: #1877f2; }
.wcpr-share-twitter       { background: #1da1f2; }
.wcpr-share-pinterest     { background: #e60023; }
.wcpr-share-done          { opacity: .6; cursor: default; pointer-events: none; }

/* --- Niveaux --- */
.wcpr-levels-table { margin: 1em 0; }
.wcpr-level-row {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 12px;
	border: 1px solid #e2e4e7;
	border-radius: 6px;
	margin-bottom: 8px;
	background: #fff;
}
.wcpr-level-active { border-color: #2271b1; background: #f0f6fc; }
.wcpr-level-badge-sm {
	min-width: 70px;
	text-align: center;
	padding: 6px 12px;
	border-radius: 20px;
	color: #fff;
	font-weight: 700;
	font-size: .85em;
	text-shadow: 0 1px 2px rgba(0,0,0,.3);
}
.wcpr-level-info { flex: 1; }
.wcpr-level-info strong { display: block; font-size: 1em; }
.wcpr-level-info span   { display: block; font-size: .85em; color: #666; margin-top: 2px; }
.wcpr-level-info small  { display: block; font-size: .8em; color: #888; margin-top: 4px; }
.wcpr-max-level { color: #2271b1; font-weight: 600; font-size: .85em; }

.wcpr-progress-bar {
	height: 8px;
	background: #e2e4e7;
	border-radius: 4px;
	margin-top: 6px;
	overflow: hidden;
}
.wcpr-progress-fill {
	height: 100%;
	background: #2271b1;
	border-radius: 4px;
	transition: width .4s;
}

/* --- Formulaire remboursement panier --- */
.wcpr-points-form {
	background: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 16px;
	margin: 1em 0;
}
.wcpr-points-form h4 { margin: 0 0 8px; font-size: 1em; }
.wcpr-points-input-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.wcpr-points-input-row input[type="number"] { width: 100px; padding: 6px 8px; border: 1px solid #ccc; border-radius: 4px; }
.wcpr-points-result { margin-top: 8px; font-size: .9em; color: #2c6fad; font-weight: 600; }
.wcpr-points-msg    { margin-top: 6px; padding: 6px 10px; border-radius: 4px; font-size: .88em; }
.wcpr-points-msg.success { background: #d4edda; color: #155724; }
.wcpr-points-msg.error   { background: #f8d7da; color: #721c24; }
