/* =================================================================
   voice-mic.css
   Yellow IPD-style microphone button + OPD typography normalisation.
   Loaded via index.html, applies globally — but the OPD font bumps
   are scoped under .opd-ipd-cover-sheet so only OPD is affected.
   ================================================================= */

/* ---------- Yellow mic button + wrapper ------------------------- */
.voice-mic-wrap {
	display: inline-flex;
	align-items: flex-start;
	gap: 6px;
	width: 100%;
	max-width: 100%;
}

.voice-mic-wrap > textarea,
.voice-mic-wrap > input {
	flex: 1 1 auto;
	min-width: 0;
}

.voice-mic-wrap > textarea {
	resize: none !important;
}

.voice-mic-btn {
	flex: 0 0 32px;
	width: 32px;
	height: 32px;
	display: none;
	background: url('../images/logo/AudioIcon.svg') no-repeat center / 32px 32px;
	cursor: pointer;
	margin-top: 2px;
	user-select: none;
	border-radius: 50%;
	transition: transform 0.15s ease;
}

.opd-ipd-cover-sheet .voice-mic-btn,
.ipd-cover-sheet .voice-mic-btn {
	display: inline-block;
}

.voice-mic-btn:hover {
	transform: scale(1.05);
}

.voice-mic-btn.recording {
	background-image: url('../images/logo/pauseButton.png');
	animation: voice-mic-pulse 1.2s ease-in-out infinite;
}

@keyframes voice-mic-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.08); }
}

/* When wrapping a table cell content we don't want the wrapper to
   collapse layout. Allow it to behave block-level if needed. */
td > .voice-mic-wrap,
.width-100 .voice-mic-wrap {
	display: flex;
	width: 100%;
}

/* ---------- Recolour any leftover legacy blue mic icons --------- */
i.fa-microphone[style*="blue"],
i.fa-microphone[style*="#254EDB"],
i.fa-microphone[style*="#254edb"] {
	color: #FFB800 !important;
}

/* ---------- Coversheet Summary header full width ---------------- */
.coversheet-summary-row {
	position: relative;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.coversheet-summary-row:before,
.coversheet-summary-row:after {
	display: none !important;
}

.coversheet-summary-main {
	float: none !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.coversheet-summary-tele {
	position: absolute !important;
	left: 0;
	top: 0;
	z-index: 2;
	float: none !important;
	width: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.coversheet-summary-panel {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 43px !important;
	box-sizing: border-box !important;
	padding: 6px 335px 6px 48px !important;
	border-left: 0 !important;
	border-right: 0 !important;
}

.coversheet-summary-title {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	margin: 0 !important;
	font-weight: 600;
	white-space: nowrap;
}

.coversheet-summary-panel > .active {
	position: absolute !important;
	right: 10px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	margin: 0 !important;
}

.coversheet-summary-panel > .active .navbar-toggle {
	position: static !important;
	float: none !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 30px !important;
	margin: 0 !important;
	padding: 5px 8px !important;
}

.coversheet-summary-recorder {
	position: absolute !important;
	right: 44px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	float: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	width: auto !important;
	min-width: 168px;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
}

.coversheet-summary-recorder .btn,
.coversheet-summary-recorder button,
.coversheet-summary-recorder .opd-voice-control,
.coversheet-summary-recorder .ipd-voice-control {
	flex: 0 0 auto !important;
}

/* ---------- IPD manual mic alignment ---------------------------- */
.ipd-dictation-field {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 38px;
	align-items: start;
	gap: 8px;
	position: relative;
}

.ipd-dictation-field-wide {
	width: 335%;
}

.ipd-dictation-field textarea {
	grid-column: 1;
	grid-row: 1;
	width: 100% !important;
	min-height: 74px !important;
	margin: 0 !important;
	padding: 14px 10px 8px !important;
	resize: none !important;
}

.ipd-dictation-field .ipd-dictation-voice-slot {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	justify-content: center;
	margin: 0 !important;
}

.ipd-dictation-field label {
	position: absolute !important;
	top: -8px !important;
	left: 10px !important;
	z-index: 1;
	padding: 0 4px;
	background: #fff !important;
}

.ipd-editor-dictation-row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 38px;
	align-items: start;
	gap: 8px;
	margin: 5px 0 0 !important;
}

.ipd-editor-dictation-row:before,
.ipd-editor-dictation-row:after {
	display: none !important;
}

.ipd-editor-field {
	grid-column: 1;
	grid-row: 1;
	float: none !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.ipd-editor-field .cke,
.ipd-editor-field textarea {
	width: 100% !important;
}

.ipd-editor-field textarea {
	resize: none !important;
}

.ipd-editor-voice-slot {
	grid-column: 2;
	grid-row: 1;
	display: flex;
	justify-content: center;
	margin: 0 !important;
}

/* ---------- OPD typography bump (match IPD reference) ----------- */
.opd-ipd-cover-sheet,
.opd-ipd-cover-sheet .panel-body,
.opd-ipd-cover-sheet .tab-content {
	font-size: 13px;
}

.opd-ipd-cover-sheet input.text-input,
.opd-ipd-cover-sheet textarea.text-input,
.opd-ipd-cover-sheet textarea,
.opd-ipd-cover-sheet input[type="text"],
.opd-ipd-cover-sheet select,
.opd-ipd-cover-sheet .form-control {
	font-size: 13px;
}

.opd-ipd-cover-sheet label,
.opd-ipd-cover-sheet .input-container label,
.opd-ipd-cover-sheet .LISDynamicLabel,
.opd-ipd-cover-sheet .opd-form-label,
.opd-ipd-cover-sheet .floating-label {
	font-size: 12.5px;
}

.opd-ipd-cover-sheet .heading-div,
.opd-ipd-cover-sheet .heading-div-1,
.opd-ipd-cover-sheet .panel-heading,
.opd-ipd-cover-sheet h4,
.opd-ipd-cover-sheet h5 {
	font-size: 14px;
}

.opd-ipd-cover-sheet table th,
.opd-ipd-cover-sheet table td {
	font-size: 12.5px;
}

.opd-ipd-cover-sheet .nav-tabs > li > a,
.opd-ipd-cover-sheet .nav-pills > li > a,
.opd-ipd-cover-sheet .btn {
	font-size: 12.5px;
}