@import url("@quoine/core/styles/_size.css");

.main {
  composes: flex ai-center from "@quoine/styles/flex.css";
}
.label {
  composes: left-small from "@quoine/styles/margin.css";
  /* label tag has cursor by default so need to set again */
  composes: pointer from "@quoine/styles/cursor.css";
}
.box {
  composes: relative from "@quoine/styles/position.css";
  composes: accent from "@quoine/styles/color.css";
}
.input {
  composes: block from "@quoine/styles/display.css";
  composes: all current-color size-2 from "@quoine/styles/border.css";
  composes: pointer from "@quoine/styles/cursor.css";

  composes: active-accent from "@quoine/styles/color.css";
  composes: active-accent-2 from "@quoine/styles/bg-color.css";
  composes: focus-accent-1 from "@quoine/styles/bg-color.css";

  width: calc($base * 1.5); height: calc($base * 1.5);
}
.icon {
  composes: absolute top left from "@quoine/styles/position.css";
  composes: none from "@quoine/styles/pointer-events.css";
}