{"version":3,"file":"clockDial.module.mjs","names":[],"sources":["../../../../../../package/common/timeInput/components/clockDial/clockDial.module.pcss"],"sourcesContent":[".clockFace {\n  position: relative;\n  width: var(--clock-size, 256px);\n  height: var(--clock-size, 256px);\n  margin: 4px auto;\n  border-radius: 50%;\n  background: var(--background-accent-light, var(--background-accent));\n  touch-action: none;\n  user-select: none;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.clockHand {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  overflow: visible;\n\n  &-line {\n    stroke: var(--primary-color);\n    stroke-width: 0.7;\n  }\n\n  &-center {\n    fill: var(--primary-color);\n  }\n\n  &-knob {\n    fill: var(--primary-color);\n  }\n}\n\n.clockNumber {\n  position: absolute;\n  transform: translate(-50%, -50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border-radius: 50%;\n  color: var(--text-color);\n  font-size: 15px;\n  font-weight: 500;\n  line-height: 1;\n\n  /* Visual only — the face handles all pointer interaction. */\n  pointer-events: none;\n  z-index: 1;\n\n  &-inner {\n    font-size: 12px;\n    color: var(--text-dark);\n  }\n\n  &-selected {\n    color: var(--text-on-primary);\n    font-weight: 600;\n  }\n}\n"],"mappings":""}