/* Course Manager — Certificate Verification */
.cm-verify-wrap {
    max-width: 680px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.cm-verify-header {
    text-align: center;
    margin-bottom: 32px;
}
.cm-verify-icon { font-size: 52px; margin-bottom: 12px; }
.cm-verify-header h2 { font-size: 26px; font-weight: 700; color: #1e293b; margin: 0 0 8px; }
.cm-verify-header p { color: #64748b; margin: 0; }

/* Form */
.cm-verify-form {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 28px;
    margin-bottom: 24px;
}
.cm-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media (max-width: 540px) { .cm-field-row { grid-template-columns: 1fr; } }
.cm-field label { display: block; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #64748b; margin-bottom: 6px; }
.cm-field label small { text-transform: none; font-weight: 400; letter-spacing: 0; font-size: 11px; color: #94a3b8; }
.cm-field input {
    width: 100%; padding: 10px 14px; border: 1px solid #e2e8f0;
    border-radius: 8px; font-size: 14px; color: #1e293b;
    background: #fff; box-sizing: border-box; transition: .15s;
}
.cm-field input:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,.15); }

.cm-btn-verify {
    display: inline-flex; align-items: center; gap: 8px;
    background: #1e40af; color: #fff;
    padding: 11px 24px; border-radius: 9px;
    font-size: 15px; font-weight: 600;
    border: none; cursor: pointer; transition: .15s; width: 100%;
    justify-content: center;
}
.cm-btn-verify:hover { background: #1e3a8a; }

/* Results */
.cm-result {
    border-radius: 14px;
    padding: 28px;
    animation: cm-fadein .3s ease;
}
@keyframes cm-fadein { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

.cm-result--success { background: #f0fdf4; border: 1.5px solid #86efac; }
.cm-result--error   { background: #fff1f2; border: 1.5px solid #fca5a5; text-align: center; }

.cm-result-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.cm-result-icon {
    width: 44px; height: 44px; border-radius: 50%;
    display: grid; place-items: center; font-size: 20px; font-weight: 700; flex-shrink: 0;
}
.cm-result--success .cm-result-icon { background: #16a34a; color: #fff; }
.cm-result--error   .cm-result-icon { background: #dc2626; color: #fff; font-size: 16px; }

.cm-result--success h3 { margin: 0; font-size: 18px; color: #15803d; }
.cm-result--error   h3 { margin: 10px 0 6px; font-size: 18px; color: #b91c1c; }
.cm-result--error   p  { color: #64748b; margin: 0; }

.cm-badge { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
.cm-badge--certificate { background: #dcfce7; color: #15803d; }
.cm-badge--diploma     { background: #fef3c7; color: #92400e; }

.cm-result-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .cm-result-grid { grid-template-columns: 1fr; } }

.cm-result-item { background: #fff; border-radius: 9px; padding: 12px 14px; border: 1px solid #e2e8f0; }
.cm-label { display: block; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: #94a3b8; margin-bottom: 3px; }
.cm-value { font-size: 14px; color: #1e293b; font-weight: 500; }
.cm-mono  { font-family: monospace; font-size: 13px; letter-spacing: .5px; }

.cm-remarks { margin-top: 14px; background: #fff; border-radius: 9px; padding: 12px 14px; border: 1px solid #e2e8f0; font-size: 13.5px; color: #475569; }
