:root{--tf-font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;--tf-font-size:13px;--tf-line-height:1.42857;--tf-color:#555;--tf-bg:#fff;--tf-border:#ccc;--tf-border-focus:#009fdb;--tf-border-error:#dc3545;--tf-radius:4px;--tf-padding:8px 12px;--tf-padding-compact:5px 8px;--tf-placeholder:#999;--tf-disabled-bg:#e9ecef;--tf-error-color:#dc3545;--tf-label-color:#333;--tf-label-font-size:13px;--tf-label-font-weight:400;--tf-required-color:#dc3545;--tf-transition:border-color .15s ease-in-out, box-shadow .15s ease-in-out}.dna-textfield{flex-direction:column;gap:4px;width:100%;display:flex}.dna-textfield__label{font-family:var(--tf-font-family);font-size:var(--tf-label-font-size);font-weight:var(--tf-label-font-weight);color:var(--tf-label-color);margin-bottom:2px}.dna-textfield__label--required:after{content:" *";color:var(--tf-required-color)}.dna-textfield__input-wrapper{align-items:center;width:100%;display:flex;position:relative}.dna-textfield__input-wrapper--has-left .dna-textfield__input{padding-left:32px}.dna-textfield__input-wrapper--has-right .dna-textfield__input{padding-right:32px}.dna-textfield__icon{pointer-events:none;color:#647493;z-index:1;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.dna-textfield__icon--left{left:8px}.dna-textfield__icon--right{right:8px}.dna-textfield__input{box-sizing:border-box;width:100%;font-family:var(--tf-font-family);font-size:var(--tf-font-size);line-height:var(--tf-line-height);color:var(--tf-color);background-color:var(--tf-bg);border:1px solid var(--tf-border);border-radius:var(--tf-radius);padding:var(--tf-padding);transition:var(--tf-transition);outline:none;display:block}.dna-textfield__input::placeholder{color:var(--tf-placeholder)}.dna-textfield__input:focus{border-color:var(--tf-border-focus);box-shadow:0 0 0 2px #009fdb26}.dna-textfield__input:disabled,.dna-textfield__input:read-only{background-color:var(--tf-disabled-bg);cursor:not-allowed}.dna-textfield__input--error{border-color:var(--tf-border-error)!important}.dna-textfield__input--error:focus{box-shadow:0 0 0 2px #dc354526}.dna-textfield__error{font-family:var(--tf-font-family);color:var(--tf-error-color);margin-top:2px;font-size:12px}.dna-textfield--compact .dna-textfield__input{padding:var(--tf-padding-compact);font-size:12px}.dna-textfield--compact .dna-textfield__label{font-size:12px}