#quiz-locker-container .content {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 20px auto;
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.quiz-locker-admin table thead tr th, .quiz-locker-admin tbody tr td {
    border: 1px solid #dadada;
}

.title { color: red; margin-bottom: 10px; }
.note { color: #0066ff; font-weight: bold; margin-bottom: 15px; }

.input-area { margin: 20px 0; text-align: center; }
.input-code {
    padding: 12px; width: 80%; max-width: 300px;
    border: 1px solid #ccc; border-radius: 8px;
}
.btn-confirm {
    background: #007bff;
	color: white; 
    border-radius: 99px;
}
.btn-confirm:hover { background: #0056b3; }

.error-message { color: red; margin-top: 8px; min-height: 20px; }

.steps { text-align: left; line-height: 1.6; }

.step-items {
	display: flex;
    align-items: center;
	padding-bottom: 4px;
}

.steps p {
	margin-bottom: 0px;
}

.keyword {
    background: #333; color: white; padding: 4px 10px;
    border-radius: 6px; font-family: monospace;
}
.highlight { color: red; font-weight: bold; }

.btn-copy {
    margin-left: 8px;
	margin-bottom: 0px;
    background: #007bff; 
	color: white; 
	border: none;
    border-radius: 8px;
	font-size: 0.9rem;
}
.btn-copy:hover { background: #0056b3; }
.btn-copy:active { transform: scale(0.95); }

.image img {
    width: 100%; 
	border-radius: 8px;
    border: 2px solid #ddd; 
	margin: 10px 0;
}