/* Ajuda contextual para os campos de Inscrição Cadastral. */
.inscricao-label-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    margin-bottom: 6px;
}

.inscricao-label-row > label {
    width: auto !important;
    margin: 0 !important;
}

.ic-help,
.ic-help-overlay {
    --ic-primary: var(--su-primary, #0a5bb8);
    --ic-primary-dark: var(--su-primary-dark, #084a96);
    --ic-primary-readable: #0a5bb8;
    --ic-accent: #b23a20;
    --ic-accent-fill: #a3371f;
    --ic-on-accent: #ffffff;
    --ic-surface: var(--su-surface, #ffffff);
    --ic-surface-soft: var(--su-surface-soft, #f1f4f8);
    --ic-text: var(--su-text, #172536);
    --ic-muted: var(--su-muted, #5f6875);
    --ic-border: var(--su-border, rgba(11, 27, 43, 0.14));
    --ic-focus: var(--su-focus, 0 0 0 4px rgba(10, 91, 184, 0.2));

    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    line-height: 1.4;
}

.ic-help {
    display: inline-flex;
    flex: 0 0 auto;
}

.ic-help-trigger,
.ic-help-close {
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    cursor: pointer;
}

.ic-help-trigger {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 27px;
    height: 27px;
    min-width: 27px;
    min-height: 27px;
    margin: 0;
    padding: 0;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 50%;
    background: linear-gradient(145deg, var(--ic-primary), var(--ic-primary-dark));
    box-shadow: 0 5px 12px rgba(10, 75, 145, 0.22);
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.ic-help-trigger::before {
    position: absolute;
    inset: -6px;
    content: "";
}

.ic-help-trigger > span {
    display: block;
    margin-top: -1px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
    font-style: italic;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
}

.ic-help-trigger:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    box-shadow: 0 7px 16px rgba(10, 75, 145, 0.3);
}

.ic-help-trigger:focus-visible,
.ic-help-close:focus-visible {
    outline: 2px solid transparent;
    outline-offset: 3px;
    box-shadow: var(--ic-focus);
}

.ic-help-overlay[hidden] {
    display: none !important;
}

.ic-help-overlay {
    position: fixed;
    z-index: 12000;
    inset: 0;
    display: grid;
    place-items: center;
    box-sizing: border-box;
    width: 100vw;
    min-height: 100vh;
    min-height: 100dvh;
    padding: clamp(14px, 4vw, 36px);
    overflow: auto;
    color: var(--ic-text);
    background: rgba(5, 15, 27, 0.7);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.ic-help-dialog {
    display: block;
    width: min(680px, 100%);
    max-height: calc(100vh - 72px);
    max-height: calc(100dvh - 72px);
    overflow: auto;
    border: 1px solid var(--ic-border);
    border-radius: 22px;
    background: var(--ic-surface);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.32);
    animation: ic-help-enter 180ms ease-out both;
}

.ic-help-header {
    position: sticky;
    z-index: 2;
    top: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 18px 20px;
    color: #ffffff;
    background:
        radial-gradient(circle at 90% -30%, rgba(255, 255, 255, 0.22), transparent 42%),
        linear-gradient(135deg, var(--ic-primary-dark), var(--ic-primary));
}

.ic-help-header-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 50%;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 27px;
    font-style: italic;
    font-weight: 700;
    line-height: 1;
    background: rgba(255, 255, 255, 0.13);
}

.ic-help-heading,
.ic-help-heading strong,
.ic-help-eyebrow {
    display: block;
}

.ic-help-heading strong {
    color: inherit;
    font-size: clamp(17px, 2.4vw, 21px);
    font-weight: 750;
    line-height: 1.2;
}

.ic-help-eyebrow {
    margin-bottom: 2px;
    color: rgba(255, 255, 255, 0.76);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ic-help-close {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin: 0;
    padding: 0;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.12);
}

.ic-help-close > span {
    display: block;
    margin-top: -3px;
    font-size: 28px;
    font-weight: 300;
    line-height: 1;
}

.ic-help-close:hover {
    background: rgba(0, 0, 0, 0.24);
}

.ic-help-body {
    display: grid;
    gap: 18px;
    padding: clamp(18px, 4vw, 28px);
    color: var(--ic-text);
    background: var(--ic-surface);
}

.ic-help-document {
    position: relative;
    display: block;
    min-height: 128px;
    overflow: hidden;
    border: 1px solid var(--ic-border);
    border-radius: 15px;
    background:
        linear-gradient(90deg, transparent 49.7%, var(--ic-border) 50%, transparent 50.3%),
        var(--ic-surface-soft);
}

.ic-help-document-bar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px;
    color: var(--ic-muted);
    border-bottom: 1px solid var(--ic-border);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.ic-help-document-lines {
    position: absolute;
    top: 53px;
    left: 14px;
    display: grid;
    gap: 9px;
    width: 42%;
}

.ic-help-document-lines i {
    display: block;
    height: 7px;
    border-radius: 999px;
    background: var(--ic-border);
}

.ic-help-document-lines i:nth-child(2) { width: 76%; }
.ic-help-document-lines i:nth-child(3) { width: 88%; }

.ic-help-document-field {
    position: absolute;
    top: 48px;
    right: 12px;
    display: grid;
    grid-template-columns: auto auto;
    align-items: end;
    padding: 9px 10px 8px;
    border: 2px solid var(--ic-accent);
    border-radius: 9px;
    background: var(--ic-surface);
    box-shadow: 0 8px 20px rgba(11, 27, 43, 0.1);
}

.ic-help-document-field > span {
    grid-column: 1 / -1;
    margin-bottom: 3px;
    color: var(--ic-muted);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ic-help-document-field strong,
.ic-help-document-field b {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: clamp(11px, 2.6vw, 15px);
    line-height: 1.2;
    white-space: nowrap;
}

.ic-help-document-field strong {
    color: var(--ic-text);
}

.ic-help-document-field b {
    margin-left: 2px;
    padding: 2px 4px;
    color: var(--ic-on-accent);
    border-radius: 4px;
    background: var(--ic-accent-fill);
}

.ic-help-document-field em {
    position: absolute;
    right: 4px;
    bottom: -19px;
    padding: 2px 6px;
    color: var(--ic-on-accent);
    border-radius: 0 0 6px 6px;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    background: var(--ic-accent-fill);
}

.ic-help-instructions {
    display: grid;
    gap: 12px;
}

.ic-help-step {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    color: var(--ic-text);
    font-size: 14px;
    line-height: 1.5;
}

.ic-help-step > b {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    color: var(--ic-primary-readable);
    border: 1px solid color-mix(in srgb, var(--ic-primary) 26%, transparent);
    border-radius: 50%;
    font-size: 12px;
    background: color-mix(in srgb, var(--ic-primary) 9%, transparent);
}

.ic-help-step strong {
    color: inherit;
    font-weight: 750;
}

.ic-help-format {
    display: grid;
    gap: 9px;
    padding: 15px 16px;
    color: var(--ic-text);
    border: 1px solid color-mix(in srgb, var(--ic-primary) 24%, transparent);
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.45;
    background: color-mix(in srgb, var(--ic-primary) 7%, var(--ic-surface));
}

.ic-help-format-badge {
    justify-self: start;
    padding: 4px 9px;
    color: #ffffff;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: var(--ic-primary);
}

.ic-help-example {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    align-items: center;
    justify-content: space-between;
    padding-top: 8px;
    color: var(--ic-muted);
    border-top: 1px solid var(--ic-border);
    font-size: 12px;
}

.ic-help-example code {
    padding: 5px 8px;
    color: var(--ic-text);
    border: 1px solid var(--ic-border);
    border-radius: 7px;
    font-size: 13px;
    background: var(--ic-surface);
}

.ic-help-example code strong {
    color: var(--ic-accent);
}

.ic-help-tip {
    display: block;
    padding: 11px 13px;
    color: var(--ic-muted);
    border-left: 3px solid var(--ic-primary);
    border-radius: 0 9px 9px 0;
    font-size: 12px;
    line-height: 1.45;
    background: var(--ic-surface-soft);
}

body.ic-help-is-open {
    overflow: hidden;
}

@keyframes ic-help-enter {
    from { opacity: 0; transform: translateY(10px) scale(0.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-color-scheme: dark) {
    .ic-help,
    .ic-help-overlay {
        --ic-primary: #1261a9;
        --ic-primary-dark: #083f77;
        --ic-primary-readable: var(--su-primary-light, #78bdff);
        --ic-accent: #ff9b7c;
        --ic-accent-fill: #b63d22;
        --ic-on-accent: #ffffff;
        --ic-surface: var(--su-surface, #111820);
        --ic-surface-soft: var(--su-surface-soft, #18222e);
        --ic-text: var(--su-text, #edf3fa);
        --ic-muted: var(--su-muted, #a7b2bf);
        --ic-border: var(--su-border, rgba(255, 255, 255, 0.13));
        --ic-focus: var(--su-focus, 0 0 0 4px rgba(107, 181, 255, 0.22));
        color-scheme: dark;
    }

    .ic-help-overlay {
        background: rgba(0, 0, 0, 0.82);
    }

    .ic-help-document-field {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.34);
    }
}

@media (max-width: 520px) {
    .ic-help-overlay {
        place-items: end center;
        padding: 8px;
    }

    .ic-help-dialog {
        max-height: calc(100vh - 16px);
        max-height: calc(100dvh - 16px);
        border-radius: 18px;
    }

    .ic-help-header {
        gap: 10px;
        padding: 14px;
    }

    .ic-help-header-icon {
        width: 36px;
        height: 36px;
        font-size: 23px;
    }

    .ic-help-close {
        width: 34px;
        height: 34px;
    }

    .ic-help-body {
        gap: 14px;
        padding: 15px;
    }

    .ic-help-document {
        min-height: 118px;
    }

    .ic-help-document-field {
        right: 8px;
    }

    .ic-help-document-lines {
        left: 10px;
        width: 32%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ic-help-trigger,
    .ic-help-dialog {
        transition: none;
        animation: none;
    }
}

@media (forced-colors: active) {
    .ic-help-trigger,
    .ic-help-close,
    .ic-help-dialog,
    .ic-help-document-field {
        border: 2px solid ButtonText;
    }

    .ic-help-trigger:focus-visible,
    .ic-help-close:focus-visible {
        outline: 3px solid Highlight;
        outline-offset: 3px;
        box-shadow: none;
    }
}

@media print {
    .ic-help,
    .ic-help-overlay {
        display: none !important;
    }
}