/*
 * ERTLMS form-note tooltips
 * Tooltip icons are used for helper notes tied to a real labeled form field.
 * System-controlled/read-only fields may use them too; unlabeled guidance stays visible.
 */

.ertlms-label-with-note {
    display: inline-flex !important;
    align-items: center;
    gap: .3rem;
    max-width: 100%;
    vertical-align: middle;
}

.ertlms-note-tooltip-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    margin-left: 0;
    vertical-align: text-bottom;
    color: var(--tblr-secondary, var(--tblr-secondary-color));
    cursor: help;
    border-radius: 50%;
    outline: 0;
    flex: 0 0 auto;
}

.ertlms-note-tooltip-trigger:hover,
.ertlms-note-tooltip-trigger:focus-visible {
    color: var(--tblr-primary);
}

.ertlms-note-tooltip-trigger:focus-visible {
    box-shadow: 0 0 0 .18rem rgba(var(--tblr-primary-rgb), .16);
}

.ertlms-note-tooltip-trigger svg {
    width: 1rem;
    height: 1rem;
    stroke: currentColor;
    pointer-events: none;
}

/* Only notes actually converted by JavaScript are hidden. */
.form-hint.ertlms-note-converted,
.form-text.ertlms-note-converted,
small.ertlms-note-converted,
.small.ertlms-note-converted {
    display: none !important;
}