.groupedinput
{
  display:flex;
  flex-direction:row;
  gap:2px;
  border: 1px solid var(--vel-color-form-border-default);
  border-radius: var(--vel-shape300-border_radius);
  padding: 0 2px;
  /* height: 24px; */
}
.groupedinput>span
{
  padding: calc(var(--vel-fixed-spacing-01) + 2px) var(--vel-fixed-spacing-02);
  min-width: 2rem;
  min-height: 1rem;
}
.groupedinput:focus-within
{
    /* outline-color: aliceblue; */
    /* outline-width: 4px; */
    /* outline-style: solid; */
    border:1px solid var(--vel-color-misc-focused);
    box-shadow: 0px 0px 0px 4px var(--vel-color-misc-pressed);
}



.groupedinput >*
{
  display:inline-block;
  border:none;
  align-self: center;
  outline:none;
}
.groupedinput *:focus
{
  border:none;
  box-shadow: none;  
}

.groupedinput .button,.groupedinput button
{
  padding-inline: calc(var(--vel-fixed-spacing-02) - 1px);
  border-radius:var(--vel-shape300-border_radius);
  min-height: 20px;
  padding-block:0;
}
.groupedinput.textbutton
{
    padding-right:0px;
}
.groupedinput.textbutton .button,.groupedinput button
{
    height:100%;
    padding-inline: calc(var(--vel-fixed-spacing-04) - 1px);
    border-radius: var(--vel-shape300-border_radius);
    border-bottom-left-radius:0px;
    border-top-left-radius:0px;
}