/* DY Index Spread mobile voice-alert layout fix.
   Presentation only: keep the existing navigation, dialog DOM, rules and events. */
@media (max-width: 760px) {
  .page-header > .chart-view-tabs {
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .page-header > .chart-view-tabs::-webkit-scrollbar {
    display: none;
  }

  .page-header > .chart-view-tabs > button,
  .page-header > .chart-view-tabs > a,
  .chart-view-tabs .dy-voice-entry {
    flex: 0 0 auto !important;
  }

  .chart-view-tabs .dy-voice-entry {
    width: auto !important;
    min-width: max-content;
    max-width: none;
    white-space: nowrap !important;
  }

  .chart-view-tabs .dy-voice-entry-label {
    white-space: nowrap;
  }

  .dy-voice-overlay {
    box-sizing: border-box;
    height: 100dvh;
    place-items: start center;
    overflow: hidden;
    padding:
      max(8px, env(safe-area-inset-top))
      8px
      max(8px, env(safe-area-inset-bottom));
  }

  .dy-voice-dialog {
    width: 100%;
    max-height: 100%;
    margin: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: none !important;
  }

  .dy-voice-dialog-head {
    top: 0;
    cursor: default;
    touch-action: auto;
  }

  .dy-voice-close {
    position: relative;
    z-index: 5;
    flex: 0 0 auto;
  }
}
