/* =========================================================
   TEXT ELEMENT — wrapper + character counter
========================================================= */

.personailit-text-wrap {
    position: relative;
}

.personailit-text-wrap .personailit-input {
    padding-right: 56px;
}

.personailit-char-counter {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11.5px;
    font-variant-numeric: tabular-nums;
    color: var(--pi-ink-soft, #6b7178);
    pointer-events: none;
    transition: color 160ms ease;
}

.personailit-char-counter-current {
    font-weight: 700;
}

.personailit-char-counter.is-near-limit {
    color: #b8860b;
}

.personailit-char-counter.is-at-limit {
    color: var(--pi-error, #c0392b);
}