/* CO-20 onboarding form.
   Kept plain and self-contained: this renders for people on unknown, sometimes
   locked-down corporate browsers, so nothing here depends on JS. */

.onb-wrap { padding: 8px 0 48px; }
.onb-narrow { max-width: 640px; }

.onb-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.onb-head h1 { margin: 0 0 4px; }

.onb-help { color: #555; font-size: 14px; margin: 4px 0 0; }
.onb-intro { color: #333; margin-bottom: 20px; }
.onb-req { color: #b32d2e; }
.onb-back { margin: 0 0 12px; }

.onb-msg { padding: 12px 14px; border-radius: 4px; margin: 16px 0; border-left: 4px solid #999; background: #f6f7f7; }
.onb-msg-ok { border-left-color: #00a32a; background: #edfaef; }
.onb-msg-error { border-left-color: #b32d2e; background: #fcf0f1; }
.onb-msg-warn { border-left-color: #dba617; background: #fcf9e8; }
.onb-msg p { margin: 6px 0 0; }
.onb-msg code { font-size: 20px; letter-spacing: 2px; }

/* Tabs */
.onb-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0 24px; border-bottom: 1px solid #ddd; padding-bottom: 8px; align-items: center; }
.onb-tab { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid #ddd; border-radius: 4px 4px 0 0;
           background: #f6f7f7; text-decoration: none; color: #222; font-weight: 500; }
.onb-tab.is-active { background: #fff; border-bottom-color: #fff; color: #000; }
.onb-tab-add { background: #fff; border-style: dashed; cursor: pointer; font: inherit; }
.onb-pill { background: #e4e6e7; border-radius: 10px; padding: 1px 8px; font-size: 12px; font-weight: 600; }
.onb-inline { display: inline; margin: 0; }

/* Section list */
.onb-sections { list-style: none; margin: 0; padding: 0; }
.onb-section { border: 1px solid #e0e0e0; border-radius: 4px; padding: 14px 16px; margin-bottom: 10px; }
.onb-section a { display: flex; justify-content: space-between; align-items: center; gap: 12px; text-decoration: none; color: #1d2327; }
.onb-section-name { font-weight: 600; font-size: 16px; }
.onb-status { font-size: 13px; color: #666; white-space: nowrap; }
.onb-status-complete { border-left: 4px solid #00a32a; }
.onb-status-in_progress { border-left: 4px solid #dba617; }
.onb-status-not_started { border-left: 4px solid #dcdcde; }

/* Fields */
.onb-form { margin-top: 20px; }
.onb-field { margin-bottom: 18px; }
.onb-field label { display: block; font-weight: 600; margin-bottom: 5px; }
.onb-field input, .onb-field select, .onb-field textarea {
    width: 100%; padding: 9px 10px; border: 1px solid #8c8f94; border-radius: 4px; font-size: 15px; background: #fff;
}
.onb-field input:focus, .onb-field select:focus, .onb-field textarea:focus { border-color: #2271b1; outline: 2px solid transparent; box-shadow: 0 0 0 1px #2271b1; }

.onb-repeater { margin: 24px 0; }
.onb-repeater h3 { margin-bottom: 10px; }
.onb-rep-row { border: 1px solid #e0e0e0; border-radius: 4px; padding: 14px 16px; margin-bottom: 12px; }
.onb-rep-row legend { font-weight: 600; padding: 0 6px; color: #555; font-size: 13px; }

.onb-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.onb-btn { background: #2271b1; border: 1px solid #2271b1; color: #fff; padding: 10px 18px; border-radius: 4px;
           font-size: 15px; cursor: pointer; }
.onb-btn:hover { background: #135e96; }
.onb-btn-secondary { background: #f6f7f7; color: #2271b1; }
.onb-btn-secondary:hover { background: #e9ecef; }
.onb-btn-plain { background: none; border: none; color: #2271b1; text-decoration: underline; padding: 0; font-size: 14px; cursor: pointer; }

@media (max-width: 600px) {
    .onb-section a { flex-direction: column; align-items: flex-start; gap: 4px; }
}

/* BAA / e-signature */
.onb-agreement { border: 1px solid #e0e0e0; border-radius: 4px; padding: 18px 20px; background: #fafafa;
                 max-height: 340px; overflow-y: auto; font-size: 14px; line-height: 1.6; margin-bottom: 24px; }
.onb-agreement-signed { background: #fff; }
.onb-sig-box { border: 1px solid #dcdcde; border-radius: 4px; padding: 14px 16px; background: #fcfcfc; }
.onb-sig-input { font-family: Georgia, 'Times New Roman', serif; font-size: 22px; font-style: italic; }
.onb-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; }
.onb-check input { width: auto; margin-top: 3px; flex: 0 0 auto; }

/* Uploads */
.onb-upload input[type=file] { padding: 8px; background: #fff; border: 1px dashed #8c8f94; }
.onb-file-have { margin: 4px 0 2px; color: #00701f; }

/* Roster error report */
.onb-rows { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; }
.onb-rows th, .onb-rows td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #e0e0e0; vertical-align: top; }
.onb-rows th { background: #f6f7f7; font-weight: 600; }
.onb-rows td:first-child { white-space: nowrap; color: #666; }