/* ============================================================
   Acknowledgement-flag validation styles
   ============================================================ */

/* Header above the checkbox group. Shown only when a
   designation exists. */
#ackFlagNotice {
    display: none;                      /* script flips to block */
    margin: 0 0 14px 0;
    padding: 12px 16px;
    background-color: #eef3fa;
    border-left: 4px solid #1B3A8C;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #1a3357;
}
#ackFlagNotice .ackReqTag {
    display: inline-block;
    background-color: #c0392b;
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 2px 8px;
    border-radius: 3px;
    margin-right: 8px;
    vertical-align: middle;
}
#ackFlagNotice strong { color: #c0392b; }

/* Red asterisk. Injected as the FIRST CHILD of each label so it
   flows with the label text instead of forcing a line break.
   display:inline is explicit here because Andar's global CSS
   sets some spans to block. */
.ackFlagStar {
    display: inline !important;
    color: #c0392b;
    font-weight: bold;
    font-size: 15px;
    margin-right: 4px;
    white-space: nowrap;
}

/* Error message shown after a blocked submit attempt. */
#ackFlagError {
    display: none;
    margin: 10px 0 14px 0;
    padding: 12px 16px;
    background-color: #fdecea;
    border-left: 4px solid #c0392b;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #922b21;
    font-weight: bold;
}

/* Red ring around the checkboxes while the error is showing.
   outline rather than border so nothing shifts. */
.ackFlagHighlight {
    outline: 2px solid #c0392b !important;
    outline-offset: 2px !important;
}
/* ================================================================
   ROSTER NAME — ANONYMOUS CONFIRMATION
   ================================================================ */

.rnAnonNotice {
    display: none;
    margin: 8px 0 6px 0;
    padding: 10px 12px;
    background: #fff8e5;
    border: 1px solid #f0c36d;
    border-left: 4px solid #d98c00;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    color: #4a3600;
}

.rnAnonNotice strong {
    font-weight: 700;
    color: #000;
}

/* Red REQUIRED pill inside the banner */
.rnReqTag {
    display: inline-block;
    margin-right: 8px;
    padding: 2px 8px;
    background: #c8102e;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #fff;
    vertical-align: 1px;
}

/* Blocked-submit message, sits directly under the field */
.rnAnonError {
    display: none;
    margin: 6px 0 10px 0;
    padding: 10px 12px;
    background: #fdecea;
    border: 1px solid #e0908c;
    border-left: 4px solid #c8102e;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    color: #7a0c1c;
}

/* Highlighted input while the error is showing */
input.rnAnonHighlight,
input.rnAnonHighlight:focus {
    border: 2px solid #c8102e !important;
    background: #fffafa !important;
    box-shadow: 0 0 0 2px rgba(200, 16, 46, .15) !important;
    outline: none !important;
}