/**
 * BRM Feedback Styles
 * Styling for vote buttons and feedback components.
 * Uses ONLY Automatic.css variables - no fallbacks, no hard-coded values.
 *
 * @package BRM\Service\Feedback
 */

/* Vote Button */
.brm-vote {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
	padding: var(--space-xs) var(--space-s);
	background: var(--primary);
	color: var(--white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-medium);
	cursor: pointer;
	transition: all var(--transition-fast);
	box-shadow: var(--shadow-sm);
}

.brm-vote:hover:not(:disabled) {
	background: var(--primary-dark);
	box-shadow: var(--shadow-md);
	transform: translateY(-1px);
}

.brm-vote:active:not(:disabled) {
	transform: translateY(0);
	box-shadow: var(--shadow-sm);
}

.brm-vote:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* Vote Button States */
.brm-vote--voted {
	background: var(--neutral);
	color: var(--white);
	cursor: not-allowed;
}

.brm-vote--loading {
	opacity: 0.7;
	cursor: wait;
}

.brm-vote--error {
	background: var(--neutral-ultra-light);
	color: var(--neutral-dark);
	padding: var(--space-s);
	border-radius: var(--radius-sm);
	font-size: var(--text-sm);
}

/* Vote Button Elements */
.brm-vote__label {
	display: inline-block;
}

.brm-votes,
.brm-vote__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--space-l);
	padding: var(--space-2xs) var(--space-xs);
	background: var(--white);
	color: var(--primary);
	border-radius: var(--radius-xs);
	font-weight: var(--font-weight-bold);
	font-size: var(--text-xs);
}

.brm-vote--voted .brm-votes {
	background: var(--neutral-ultra-light);
	color: var(--neutral-dark);
}

/* Empty State */
.brm-empty {
	padding: var(--space-m);
	background: var(--neutral-ultra-light);
	border-radius: var(--radius-sm);
	color: var(--neutral-dark);
	text-align: center;
	font-size: var(--text-sm);
}