/* KAMUCO Lecteur Vocal — styles front */

.klv-wrap { display: inline-flex; vertical-align: middle; margin: 0 .35em; }
.klv-inline { display: inline-flex; align-items: baseline; gap: .4em; }

.klv-btn {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	font: inherit;
	font-size: .82em;
	line-height: 1;
	padding: .35em .7em;
	border: 1px solid #1d4e89;
	border-radius: 999px;
	background: #1d4e89;
	color: #fff;
	cursor: pointer;
	transition: background .15s ease, transform .1s ease, box-shadow .15s ease;
	white-space: nowrap;
	-webkit-appearance: none;
	appearance: none;
}
.klv-btn:hover { background: #16406f; }
.klv-btn:active { transform: scale(.97); }
.klv-btn:focus-visible { outline: 2px solid #f5a623; outline-offset: 2px; }

.klv-btn--human { background: #2e7d32; border-color: #2e7d32; }
.klv-btn--human:hover { background: #256628; }

.klv-btn--active {
	background: #c62828;
	border-color: #c62828;
	box-shadow: 0 0 0 3px rgba(198, 40, 40, .25);
}
.klv-btn--active::before {
	content: "";
	width: .55em; height: .55em;
	border-radius: 50%;
	background: #fff;
	animation: klv-pulse 1s infinite;
}
@keyframes klv-pulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }

/* Surlignage du mot lu */
.klv-word--on {
	background: #fff3c4;
	border-radius: 3px;
	box-shadow: 0 0 0 2px #fff3c4;
}

/* ---- Mode sélection (admin) ---- */
body.klv-selecting * { cursor: crosshair !important; }
.klv-hover {
	outline: 2px dashed #f5a623 !important;
	outline-offset: 2px;
	background: rgba(245, 166, 35, .08) !important;
}

/* ---- Barre flottante (admin) ---- */
.klv-recorder-bar {
	position: fixed;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	z-index: 99998;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 14px;
	background: #0f2a4a;
	color: #fff;
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,.35);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 14px;
	max-width: 92vw;
}
.klv-recorder-brand { font-weight: 700; letter-spacing: .3px; }
.klv-rec-toggle {
	border: 0;
	border-radius: 8px;
	padding: 7px 12px;
	background: #f5a623;
	color: #1a1a1a;
	font-weight: 600;
	cursor: pointer;
}
.klv-rec-toggle--on { background: #c62828; color: #fff; }
.klv-rec-hint { font-size: 12px; opacity: .85; }

/* ---- Panneau d'enregistrement ---- */
.klv-recorder-panel {
	position: fixed;
	right: 16px;
	bottom: 76px;
	z-index: 99999;
	width: 340px;
	max-width: 92vw;
	background: #fff;
	color: #1a1a1a;
	border-radius: 14px;
	box-shadow: 0 12px 40px rgba(0,0,0,.3);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 14px;
	overflow: hidden;
}
.klv-rp-head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 12px 14px; background: #0f2a4a; color: #fff;
}
.klv-rp-close { background: transparent; border: 0; color: #fff; font-size: 16px; cursor: pointer; line-height: 1; }
.klv-rp-preview { margin: 10px 14px; font-style: italic; color: #444; font-size: 13px; }

.klv-rp-tabs { display: flex; gap: 6px; padding: 0 14px; }
.klv-rp-tab {
	flex: 1; border: 1px solid #d0d0d0; background: #f4f4f4;
	border-radius: 8px; padding: 8px; cursor: pointer; font-weight: 600; color: #333;
}
.klv-rp-tab--on { background: #1d4e89; color: #fff; border-color: #1d4e89; }

.klv-rp-body { padding: 12px 14px; }
.klv-rp-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.klv-rp-row label { display: flex; align-items: center; gap: 6px; font-size: 13px; }

.klv-rp-btn {
	border: 0; border-radius: 8px; padding: 8px 12px;
	background: #1d4e89; color: #fff; cursor: pointer; font-weight: 600; font-size: 13px;
}
.klv-rp-btn:disabled { opacity: .5; cursor: not-allowed; }
.klv-rp-record { background: #c62828; }
.klv-rp-stop { background: #555; }
.klv-rp-delete { background: #b0392e; }
.klv-rp-save { background: #2e7d32; }
.klv-rp-test { background: #6a4fb0; }

.klv-rp-time { font-variant-numeric: tabular-nums; font-weight: 600; }
.klv-rp-upload { cursor: pointer; text-decoration: underline; color: #1d4e89; font-size: 13px; }
.klv-rp-audio { width: 100%; margin-top: 4px; }
.klv-rp-note { font-size: 12px; color: #666; margin: 0 0 10px; }
.klv-rp-voice, .klv-rp-label { padding: 6px 8px; border: 1px solid #ccc; border-radius: 6px; font: inherit; }
.klv-rp-voice { max-width: 220px; }
.klv-rp-label-row { padding: 0 14px 4px; }
.klv-rp-label { flex: 1; min-width: 0; }
.klv-rp-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 14px 14px; }
.klv-rp-status { padding: 0 14px 12px; margin: 0; font-size: 13px; color: #2e7d32; min-height: 1em; }
.klv-rp-status--err { color: #c62828; }

/* ---- Espace shortcode ---- */
.klv-espace {
	border: 1px dashed #1d4e89;
	border-radius: 12px;
	padding: 16px;
	background: #f6f9fe;
	margin: 16px 0;
}
.klv-espace__titre { margin: 0 0 8px; }
.klv-espace__txt { margin: 0 0 12px; color: #333; }