/* roster-upload — Upload CSV Roster. Figma 600:35917. */

.roster-upload {
    /* Figma 600:35917 is a ~680px centered card; unrestricted, the dropzone
       stretched edge-to-edge across the content column at desktop widths. */
    max-width: 44rem;
    margin-inline: auto;
    padding: var(--wa-space-xl);
    background: var(--wa-color-surface-default);
    border: 1px solid var(--wa-color-surface-border);
    border-radius: var(--wa-border-radius-l);
}

.roster-upload__breadcrumb {
    color: var(--wa-color-text-quiet);
    font-size: var(--wa-font-size-s);
}

.roster-upload__title {
    font-family: var(--wa-font-family-heading);
    font-weight: var(--wa-font-weight-heading);
    font-size: var(--wa-font-size-2xl);
}

.roster-upload__instructions {
    color: var(--wa-color-text-quiet);
    font-size: var(--wa-font-size-s);
    padding-bottom: var(--wa-space-l);
}

.roster-upload__instructions code {
    background: var(--wa-color-surface-lowered);
    padding: 0.125rem 0.25rem;
    border-radius: var(--wa-border-radius-m);
}

.roster-upload__file {
    display: block;
    padding: var(--wa-space-s);
    border: 1px solid var(--wa-color-surface-border);
    border-radius: var(--wa-border-radius-m);
    margin-bottom: var(--wa-space-m);
    max-width: 32rem;
}

/* Refused rows are a normal outcome of a partial import, not an error state — style as a report. */

.roster-upload__errors {
    margin-top: var(--wa-space-l);
    padding: var(--wa-space-m);
    border: 1px solid var(--wa-color-neutral-border-quiet);
    border-radius: var(--wa-border-radius-m);
    background: var(--wa-color-surface-lowered);
}

.roster-upload__errors h2 {
    font-size: var(--wa-font-size-s);
    margin-bottom: var(--wa-space-s);
}

.roster-upload__errors li {
    font-size: var(--wa-font-size-s);
    padding-block: 0.125rem;
}

/* HMS-304 — copilot review screen and plain-language error explanations.
   The mapping table is a plain table; warnings sit between it and the form. */

.roster-upload__mapping {
    border-collapse: collapse;
    margin-block: var(--wa-space-m) var(--wa-space-l);
    max-width: 56rem;
}

.roster-upload__mapping th,
.roster-upload__mapping td {
    text-align: left;
    padding: var(--wa-space-s) var(--wa-space-m) var(--wa-space-s) 0;
    border-bottom: 1px solid var(--wa-color-neutral-border-quiet);
    font-size: var(--wa-font-size-s);
    vertical-align: top;
}

.roster-upload__select {
    font: inherit;
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--wa-color-surface-border);
    border-radius: var(--wa-border-radius-m);
    background: var(--wa-color-surface-default);
}

.roster-upload__confidence {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: var(--wa-border-radius-m);
    font-size: var(--wa-font-size-s);
    margin-right: var(--wa-space-s);
    background: var(--wa-color-surface-lowered);
    border: 1px solid var(--wa-color-neutral-border-quiet);
}

.roster-upload__confidence--high {
    background: var(--wa-color-success-fill-quiet);
    border-color: var(--wa-color-success-border-normal);
    color: var(--wa-color-success-on-quiet);
}

.roster-upload__confidence--low {
    background: var(--wa-color-warning-fill-quiet);
    border-color: var(--wa-color-warning-border-normal);
    color: var(--wa-color-warning-on-quiet);
}

.roster-upload__confidence--medium {
    background: var(--wa-color-warning-fill-quiet);
    border-color: var(--wa-color-warning-border-normal);
    color: var(--wa-color-warning-on-quiet);
}

.roster-upload__reason {
    color: var(--wa-color-text-quiet);
    font-size: var(--wa-font-size-s);
}

.roster-upload__warning {
    margin-block-end: var(--wa-space-m);
    padding: var(--wa-space-m);
    max-width: 42rem;
    border: 1px solid var(--wa-color-warning-border-normal);
    border-radius: var(--wa-border-radius-m);
    background: var(--wa-color-warning-fill-quiet);
}

.roster-upload__warning h2 {
    font-size: var(--wa-font-size-s);
    margin-bottom: var(--wa-space-s);
}

.roster-upload__warning li {
    font-size: var(--wa-font-size-s);
    padding-block: 0.125rem;
}

.roster-upload__explanations {
    margin-top: var(--wa-space-l);
    padding: var(--wa-space-m);
    max-width: 42rem;
    border: 1px solid var(--wa-color-neutral-border-quiet);
    border-radius: var(--wa-border-radius-m);
    background: var(--wa-color-surface-lowered);
}

.roster-upload__explanations h2 {
    font-size: var(--wa-font-size-s);
    margin-bottom: var(--wa-space-s);
}

.roster-upload__explanation {
    padding-block: var(--wa-space-s);
}

.roster-upload__explanation h3 {
    font-size: var(--wa-font-size-s);
    font-weight: 600;
}

.roster-upload__explanation p {
    font-size: var(--wa-font-size-s);
    margin: 0.125rem 0;
}

.roster-upload__explanation-fix,
.roster-upload__explanation-lines {
    color: var(--wa-color-text-quiet);
}