/* ── Company Manager Registration Form ──────────────────────────────────── */
.cm-reg-wrap { max-width: 780px; margin: 0 auto; font-family: inherit; }

/* Notices */
.cm-reg-notice {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    border-radius: 6px;
    margin-bottom: 24px;
    font-size: 15px;
    line-height: 1.5;
}
.cm-reg-notice p { margin: 4px 0 0; }
.cm-reg-success { background: #f0fdf4; border: 1px solid #86efac; color: #166534; }
.cm-reg-error   { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; }
.cm-reg-icon { font-size: 20px; font-weight: 700; flex-shrink: 0; margin-top: 1px; }

/* Sections */
.cm-reg-section {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 28px 32px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,.05);
}

.cm-reg-section-title {
    font-size: 17px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 22px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.cm-reg-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: #1A56A5;
    color: #fff;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}

/* Grid */
.cm-reg-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}
@media (max-width: 600px) {
    .cm-reg-grid { grid-template-columns: 1fr; }
    .cm-reg-section { padding: 20px 16px; }
}

.cm-reg-field { display: flex; flex-direction: column; gap: 6px; }
.cm-reg-field--full { grid-column: 1 / -1; }

/* Labels & inputs */
.cm-reg-field label {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}
.cm-req { color: #ef4444; margin-left: 2px; }

.cm-reg-field input,
.cm-reg-field select {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 15px;
    color: #111827;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
    box-sizing: border-box;
    -webkit-appearance: none;
}
.cm-reg-field input:focus,
.cm-reg-field select:focus {
    outline: none;
    border-color: #1A56A5;
    box-shadow: 0 0 0 3px rgba(26,86,165,.12);
}
.cm-reg-field input::placeholder { color: #9ca3af; }

.cm-field-hint {
    font-size: 12px;
    color: #6b7280;
    margin-top: -2px;
}

/* Submit area */
.cm-reg-submit { text-align: center; padding: 8px 0 4px; }

.cm-reg-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #1A56A5;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 13px 36px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s, transform .1s;
    min-width: 200px;
}
.cm-reg-btn:hover:not(:disabled) { background: #1444884; }
.cm-reg-btn:active:not(:disabled) { transform: scale(.98); }
.cm-reg-btn:disabled { opacity: .7; cursor: not-allowed; }

.cm-reg-btn-spinner { display: flex; align-items: center; gap: 8px; }
.cm-reg-btn-spinner svg { animation: cm-spin 1s linear infinite; }
@keyframes cm-spin { to { transform: rotate(360deg); } }

.cm-reg-terms {
    font-size: 13px;
    color: #6b7280;
    margin-top: 12px;
}

/* ── Password field ──────────────────────────────────────────────────────── */
.cm-password-wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.cm-password-wrap input {
    padding-right: 44px !important;
}
.cm-toggle-pw {
    position: absolute;
    right: 12px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #9ca3af;
    display: flex;
    align-items: center;
    transition: color .15s;
}
.cm-toggle-pw:hover,
.cm-toggle-pw--visible { color: #1A56A5; }

/* Strength meter */
.cm-password-strength {
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 18px;
}
.cm-pw-bar {
    flex: 1;
    height: 4px;
    background: #e5e7eb;
    border-radius: 2px;
    overflow: hidden;
}
.cm-pw-bar span {
    display: block;
    height: 100%;
    border-radius: 2px;
    transition: width .3s, background .3s;
}
.cm-pw-label {
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
