:root {
  --ty-time-picker-input-min-width-sm: 70px;
  --ty-time-picker-input-min-width-md: 90px;
  --ty-time-picker-input-min-width-lg: 110px;
  --ty-time-picker-column-max-height: 224px;
  --ty-time-picker-column-border: var(--ty-color-border-light);
  --ty-time-picker-scrollbar-thumb: var(--ty-color-text-quaternary);
  --ty-time-picker-cell-padding: 4px 0;
  --ty-time-picker-cell-min-width: 52px;
  --ty-time-picker-cell-radius: 4px;
  --ty-time-picker-cell-margin-inline: 4px;
  --ty-time-picker-cell-line-height: 20px;
  --ty-time-picker-cell-bg-selected: var(--ty-color-primary-bg);
  --ty-time-picker-cell-bg-selected-hover: var(--ty-color-primary-bg-hover);
  --ty-time-picker-cell-font-weight-selected: 500;
  --ty-time-picker-footer-padding: 8px 12px;
  --ty-time-picker-footer-border: var(--ty-color-border-light);
  --ty-time-picker-footer-font-size: 12px;
  --ty-time-picker-now-color: var(--ty-color-primary);
  --ty-time-picker-now-color-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-padding: 0 8px;
  --ty-time-picker-ok-button-height: 24px;
  --ty-time-picker-ok-button-font-size: 12px;
  --ty-time-picker-ok-button-radius: 4px;
  --ty-time-picker-ok-button-bg: var(--ty-color-primary);
  --ty-time-picker-ok-button-bg-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-color: #fff;
}

[data-tiny-theme='dark'] {
  --ty-time-picker-input-min-width-sm: 70px;
  --ty-time-picker-input-min-width-md: 90px;
  --ty-time-picker-input-min-width-lg: 110px;
  --ty-time-picker-column-max-height: 224px;
  --ty-time-picker-column-border: var(--ty-color-border-light);
  --ty-time-picker-scrollbar-thumb: var(--ty-color-text-quaternary);
  --ty-time-picker-cell-padding: 4px 0;
  --ty-time-picker-cell-min-width: 52px;
  --ty-time-picker-cell-radius: 4px;
  --ty-time-picker-cell-margin-inline: 4px;
  --ty-time-picker-cell-line-height: 20px;
  --ty-time-picker-cell-bg-selected: var(--ty-color-primary-bg);
  --ty-time-picker-cell-bg-selected-hover: var(--ty-color-primary-bg-hover);
  --ty-time-picker-cell-font-weight-selected: 500;
  --ty-time-picker-footer-padding: 8px 12px;
  --ty-time-picker-footer-border: var(--ty-color-border-light);
  --ty-time-picker-footer-font-size: 12px;
  --ty-time-picker-now-color: var(--ty-color-primary);
  --ty-time-picker-now-color-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-padding: 0 8px;
  --ty-time-picker-ok-button-height: 24px;
  --ty-time-picker-ok-button-font-size: 12px;
  --ty-time-picker-ok-button-radius: 4px;
  --ty-time-picker-ok-button-bg: var(--ty-color-primary);
  --ty-time-picker-ok-button-bg-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-color: #fff;
}

@media (prefers-color-scheme: dark) {
  [data-tiny-theme='system'] {
  --ty-time-picker-input-min-width-sm: 70px;
  --ty-time-picker-input-min-width-md: 90px;
  --ty-time-picker-input-min-width-lg: 110px;
  --ty-time-picker-column-max-height: 224px;
  --ty-time-picker-column-border: var(--ty-color-border-light);
  --ty-time-picker-scrollbar-thumb: var(--ty-color-text-quaternary);
  --ty-time-picker-cell-padding: 4px 0;
  --ty-time-picker-cell-min-width: 52px;
  --ty-time-picker-cell-radius: 4px;
  --ty-time-picker-cell-margin-inline: 4px;
  --ty-time-picker-cell-line-height: 20px;
  --ty-time-picker-cell-bg-selected: var(--ty-color-primary-bg);
  --ty-time-picker-cell-bg-selected-hover: var(--ty-color-primary-bg-hover);
  --ty-time-picker-cell-font-weight-selected: 500;
  --ty-time-picker-footer-padding: 8px 12px;
  --ty-time-picker-footer-border: var(--ty-color-border-light);
  --ty-time-picker-footer-font-size: 12px;
  --ty-time-picker-now-color: var(--ty-color-primary);
  --ty-time-picker-now-color-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-padding: 0 8px;
  --ty-time-picker-ok-button-height: 24px;
  --ty-time-picker-ok-button-font-size: 12px;
  --ty-time-picker-ok-button-radius: 4px;
  --ty-time-picker-ok-button-bg: var(--ty-color-primary);
  --ty-time-picker-ok-button-bg-hover: var(--ty-color-primary-hover);
  --ty-time-picker-ok-button-color: #fff;
}
}