.input{position:relative;width:100%}.input__icon{display:flex;position:absolute;top:50%;right:24px;height:24px;transform:translateY(-50%);pointer-events:none}.input__icon path{stroke:var(--ncos-colour-sys-on-surface)}.input--is-opened .input__icon{transform:translateY(-50%) rotate(-180deg)}.input input{display:flex;align-items:center;box-sizing:border-box;height:48px;min-width:180px;width:100%;padding:0 24px;color:var(--ncos-colour-sys-on-surface);background:var(--ncos-colour-sys-surface);border:1px solid var(--ncos-colour-sys-outline-alt);border-radius:4px}.input input::placeholder{color:var(--ncos-colour-sys-on-surface-alt)}.input input:hover{border-color:var(--ncos-colour-sys-primary)}.input input:active,.input input:focus,.input input:focus-visible{outline:none;border-color:var(--ncos-colour-sys-secondary)}.input input[readonly]{cursor:pointer}