import { css } from "lit";
const componentStyle = css`
          * {
            -webkit-tap-highlight-color: transparent;
          }

:host {
  display: block;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  height: var(--ui-components-audio-recording-item-touch-target-size, 48px);
  padding-right: var(
    --ui-components-audio-recording-item-padding-horizontal,
    8px
  );
  gap: var(--global-size-spacing-target-padding);
}

.wrapper .status-toggle-button {
    position: relative;
  }

.recording-container {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  background-color: var(--indent-enabled-background-color);
  border: 1px solid var(--indent-enabled-border-color);
  height: var(--ui-components-audio-input-height, 32px);
  box-sizing: border-box;
  border-radius: var(--ui-components-audio-recording-item-border-radius, 6px);
}

.status-toggle-button {
  flex-shrink: 0;
  margin-left: -9px;
}

.audio-recording-container {
  display: flex;
  align-items: center;
  flex: 1;
  height: var(--ui-components-audio-input-height, 32px);
  padding: 0 8px;
  overflow: hidden;
  min-width: 0;
}

.waveform-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ui-components-audio-input-spacing, 4px);
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.waveform-bar {
  width: var(--ui-components-audio-input-dot-size, 4px);
  min-height: var(--ui-components-audio-input-dot-size, 4px);
  max-height: var(--ui-components-audio-input-max-bar-height, 22px);
  border-radius: var(--ui-components-audio-input-border-radius, 1000px);
  background-color: var(--element-active-color);
  flex-shrink: 0;
  transition: height 0.1s ease-out;
}

.waveform-dot {
  width: var(--ui-components-audio-input-dot-size, 4px);
  height: var(--ui-components-audio-input-dot-size, 4px);
  border-radius: var(--ui-components-audio-input-border-radius, 1000px);
  background-color: var(--element-disabled-color);
  flex-shrink: 0;
}

.duration-container {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--ui-components-audio-recording-item-label-spacing, 8px);
  flex-shrink: 0;
}

.duration-label {
  font-family: var(--global-typography-font-family);
  font-weight: var(
    --global-typography-instrument-value-regular-font-weight-regular
  );
  font-size: var(--global-typography-instrument-value-regular-font-size);
  line-height: var(--global-typography-instrument-value-regular-line-height);
  font-feature-settings:
    "liga" off,
    "clig" off,
    "ss04" on;
}

/* Enhanced style - only changes the waveform bar color */

.wrapper.enhanced .waveform-bar {
  background-color: var(--element-neutral-enhanced-color);
}

/* Playback slider */

.playback-slider {
  flex: 1;
  min-width: 0;
}
`;
export {
  componentStyle as default
};
//# sourceMappingURL=audio-recording-item.css.js.map
