/**
 * ==================================================
 * ACE Option Card
 * ==================================================
 *
 * Assessment option card component.
 *
 * Displays a selectable answer option with visual
 * states for:
 *
 * • Default
 * • Selected
 * • Correct
 * • Incorrect
 *
 * @package ACE_Assessment_Engine
 */

/* ==================================================
   ACE OPTION CARD
================================================== */

.ace-option-card{

	display:flex;

	align-items:center;

	gap:18px;

	padding:20px 22px;

	margin-bottom:16px;

	background:#fff;

	border:1px solid var(--ace-border);

	border-radius:22px;

	cursor:pointer;

	transition:.25s;

}

.ace-option-card:hover{

	transform:translateY(-2px);

	box-shadow:0 8px 24px rgba(0,0,0,.06);

}

.ace-option-card input{

	margin:0;

}

.ace-option-letter{

	width:40px;

	height:40px;

	border-radius:999px;

	background:#F3F4F6;

	display:flex;

	align-items:center;

	justify-content:center;

	font-weight:700;

	flex-shrink:0;

}

.ace-option-text{

	font-size:1.2rem;

	line-height:1.5;

	font-weight:500;

	flex:1;

}

.ace-option-card--selected{

	border:2px solid #2563EB;

	background:#EFF6FF;

}

.ace-option-card--correct{

	border:2px solid #22C55E;

	background:#ECFDF5;

}

.ace-option-card--correct .ace-option-letter{

	background:#22C55E;

	color:#fff;

}

.ace-option-card--incorrect{

	border:2px solid #EF4444;

	background:#FEF2F2;

}

.ace-option-card--incorrect .ace-option-letter{

	background:#EF4444;

	color:#fff;

}