@charset "utf-8";

.recording-duration-wrapper { position: fixed; top: 0px; left: 0px; width: 100vw; height: 100vh; z-index: 10000; pointer-events: none; display: flex; box-sizing: border-box; }

.recording-duration-wrapper > * { pointer-events: auto; }

.recording-duration-container { background-color: rgb(46, 41, 41); border-radius: 6px; padding: 8px 12px; display: flex; align-items: center; gap: 8px; z-index: 10000; box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px; user-select: none; box-sizing: border-box; }

.position-top-center { padding-top: 20px; justify-content: center; align-items: flex-start; }

.position-right-center { padding-right: 20px; justify-content: flex-end; align-items: center; }

.position-bottom-center { padding-bottom: 20px; justify-content: center; align-items: flex-end; }

.position-left-center { padding-left: 20px; justify-content: flex-start; align-items: center; }

.recording-duration-dragTrigger { padding: 4px 10px 4px 4px; cursor: move; margin-right: 15px; }

.recording-duration-dragHandle { width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; cursor: move; color: rgb(255, 255, 255); }

.recording-duration-durationDisplay { font-size: 14px; color: rgb(255, 255, 255); display: flex; align-items: center; margin: 0px 5px; min-width: 100px; }

.recording-duration-time-display span { font-feature-settings: "tnum"; }

.recording-duration-recordingIcon { color: rgb(233, 88, 83); font-style: normal; height: 1em; width: 1em; font-size: 24px; margin: 0px 5px; }

.recording-duration-stopButton { background-color: rgb(233, 88, 83); border-radius: 5px; color: rgb(255, 255, 255); padding: 0px 11px; font-size: 12px; height: 24px; line-height: 24px; cursor: pointer; }