/* 인증 시험 접수·발표 — SSOT 23절 "시험 접수·발표". 진행 순서 네 칸 → 내 신청 카드 → 신청서 / 인증 번호 조회 → 합격자 명단. */
.cert-apply, .cert-results { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); max-inline-size: 68rem; }
.cert-apply { container: cert-apply / inline-size; }
:is(.cert-apply, .cert-results) :is(h2, h3, p, ol, ul, dl) { margin: 0; }
:is(.cert-apply, .cert-results) :is(p, h2, h3, a, li, dd) { min-inline-size: 0; overflow-wrap: anywhere; }
:is(.cert-apply, .cert-results) h2 { font-size: var(--wa-font-size-l); line-height: 1.6; }
:is(.cert-apply, .cert-results) h3 { font-size: var(--wa-font-size-m); line-height: 1.6; }
:is(.cert-apply, .cert-results) > section { display: grid; gap: var(--wa-space-m); }
:is(.cert-apply, .cert-results) .sonub-button { min-block-size: 2.75rem; line-height: 1.6; }

/* 진행 순서 — 칸 사이를 선으로 잇는다(넓은 화면은 가로, 좁은 화면은 세로) */
.cert-apply-steps ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--wa-space-l); padding: 0; list-style: none; counter-reset: cert-step; }
.cert-apply-steps li { position: relative; display: grid; align-content: start; gap: var(--wa-space-xs); padding: var(--wa-space-l); border: 1px solid var(--wa-color-surface-border); border-radius: var(--wa-border-radius-l); background: var(--wa-color-surface-raised); counter-increment: cert-step; }
.cert-apply-steps li::after { content: ''; position: absolute; inset-block-start: 2.5rem; inset-inline-start: 100%; inline-size: var(--wa-space-l); border-block-start: 2px solid var(--wa-color-brand-fill-loud); }
.cert-apply-steps li:last-child::after { content: none; }
.cert-apply-steps h3::before { content: counter(cert-step) '. '; color: var(--wa-color-brand-on-quiet); }
.cert-apply-steps p { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-s); line-height: 1.75; }

/* 내 신청 */
.cert-apply-workspace { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr)); align-items: start; gap: var(--wa-space-l); min-inline-size: 0; }
.cert-apply-workspace > section, .cert-results > section { display: grid; gap: var(--wa-space-l); min-inline-size: 0; padding: var(--wa-space-l); border: 1px solid var(--sonub-border); border-radius: var(--sonub-radius-panel); background: var(--sonub-surface); }
.cert-apply-workspace h2, .cert-results > section > h2 { padding-block-end: var(--wa-space-s); border-block-end: 1px solid var(--sonub-border); }
.cert-apply-list { display: grid; gap: var(--wa-space-m); padding: 0; list-style: none; }
.cert-apply-list > li { display: grid; gap: var(--wa-space-s); padding: var(--wa-space-l); }
.cert-apply-item-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wa-space-s); }
.cert-apply-meta, .cert-apply-hint { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-s); }
.cert-apply-interview { display: grid; justify-items: start; gap: var(--wa-space-s); padding: var(--wa-space-m); border-radius: var(--wa-border-radius-m); background: var(--wa-color-brand-fill-quiet); }
.cert-apply-interview time { font-weight: var(--wa-font-weight-semibold); }
:is(.cert-apply-number, .cert-apply-note) > span:first-child { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-s); }
.cert-apply-number strong { font-size: var(--wa-font-size-l); color: var(--wa-color-brand-on-quiet); }
.cert-apply-list .sonub-button { justify-self: start; }

/* 신청서 */
.cert-apply-form { max-inline-size: var(--sonub-form-width, 42rem); }
.cert-apply-form :is(input:not([type='checkbox'], [type='radio']), select) { inline-size: 100%; min-inline-size: 0; }
.cert-apply-form :is(input[type='checkbox'], input[type='radio']) { flex: none; }
.cert-apply-form .form-check { padding: var(--wa-space-m); border: 1px solid var(--sonub-border); border-radius: var(--wa-border-radius-m); background: var(--sonub-canvas); line-height: 1.7; }
.cert-apply-form .form-check:has(:checked) { border-color: var(--wa-color-brand-border-normal); background: var(--wa-color-brand-fill-quiet); }
.cert-apply-form input[type='file'] { overflow: hidden; }
.cert-apply-login { display: grid; justify-items: start; gap: var(--wa-space-s); }
.cert-apply-links { flex-wrap: wrap; }

/* 발표 — 조회 결과와 명단 표 */
.cert-results-form { grid-template-columns: minmax(0, 16rem) auto; align-items: end; gap: var(--wa-space-s); }
.cert-results-found dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--wa-space-2xs) var(--wa-space-l); }
.cert-results-found dt { color: var(--wa-color-text-quiet); }
.cert-results-found dd { margin: 0; font-weight: var(--wa-font-weight-semibold); }
.cert-results-found { border-inline-start: 3px solid var(--wa-color-success-border-normal); }
.cert-results-found > p { color: var(--wa-color-success-on-quiet); }
.cert-results-table { overflow-x: auto; }
.cert-results-table:focus-visible { outline: 2px solid var(--sonub-accent); outline-offset: 2px; }
.cert-results-table tbody tr:nth-child(even) { background: var(--sonub-canvas); }
.cert-results-table td a { display: inline-flex; align-items: center; min-block-size: 2.75rem; min-inline-size: 2.75rem; font-weight: var(--wa-font-weight-semibold); }
.cert-results-table table { inline-size: 100%; border-collapse: collapse; }
.cert-results-table :is(th, td) { padding: var(--wa-space-s) var(--wa-space-m); border-block-end: 1px solid var(--wa-color-surface-border); text-align: start; }
.cert-results-table th { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-s); font-weight: var(--wa-font-weight-semibold); }
.cert-results-table td { overflow-wrap: anywhere; }
.cert-results-table :is(th, td):first-child { font-variant-numeric: tabular-nums; }
@container cert-apply (max-width: 36rem) {
    .cert-apply-workspace > section { padding: var(--wa-space-m); }
}

@media (max-width: 1200px) {
	.cert-apply-steps ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cert-apply-steps li:nth-child(2n)::after { content: none; }
}
@media (max-width: 900px) {
	.cert-apply-steps ol { grid-template-columns: minmax(0, 1fr); }
	.cert-apply-steps li:nth-child(2n)::after { content: ''; }
	.cert-apply-steps li:last-child::after { content: none; }
	.cert-apply-steps li::after { inset-block-start: 100%; inset-inline-start: 2.5rem; inline-size: 0; block-size: var(--wa-space-l); border-block-start: 0; border-inline-start: 2px solid var(--wa-color-brand-fill-loud); }
	.cert-results-form { grid-template-columns: minmax(0, 1fr); }
}
:lang(ur) :is(.cert-apply, .cert-results) :is(h1, h2, h3, p, li, a, td, dd) { line-height: 2; letter-spacing: 0; }