/* Curated insights section-specific stylesheet.
   Core visual styles are provided by /dist/master.css. */

#react_0HNJTIFDCDQFG .trending-topics-container {
  position: relative;
}

#react_0HNJTIFDCDQFG .topic-image {
  display: block;
  max-width: 100%;
}

/* Mobile: clear separation from hero imagery above */
@media (max-width: 991px) {
  #react_0HNJTIFDCDQFG .trending-topics-container,
  #root .trending-topics-container,
  .trending-topics-container {
    background-color: #ffffff;
    padding-top: max(32px, env(safe-area-inset-top, 0px));
    padding-left: max(0px, env(safe-area-inset-left, 0px));
    padding-right: max(0px, env(safe-area-inset-right, 0px));
    box-sizing: border-box;
  }

  /* Topic pills: horizontal scroll with scrollbar along the bottom edge */
  #react_0HNJTIFDCDQFG .trending-topics-container .pill-wrapper,
  #root .trending-topics-container .pill-wrapper,
  .trending-topics-container .pill-wrapper {
    overflow: hidden;
    max-width: 100%;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pill-container,
  #root .trending-topics-container .pill-container,
  .trending-topics-container .pill-container {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #94a3b8 #f1f5f9;
    padding-bottom: 10px;
    margin-bottom: 2px;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pill-item,
  #root .trending-topics-container .pill-item,
  .trending-topics-container .pill-item {
    flex: 0 0 auto;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pill-container::-webkit-scrollbar,
  #root .trending-topics-container .pill-container::-webkit-scrollbar,
  .trending-topics-container .pill-container::-webkit-scrollbar {
    height: 6px;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pill-container::-webkit-scrollbar-track,
  #root .trending-topics-container .pill-container::-webkit-scrollbar-track,
  .trending-topics-container .pill-container::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pill-container::-webkit-scrollbar-thumb,
  #root .trending-topics-container .pill-container::-webkit-scrollbar-thumb,
  .trending-topics-container .pill-container::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 3px;
  }

  /* Pause/play: left-aligned on all mobile widths (auto right margin replaces fixed px) */
  #react_0HNJTIFDCDQFG .trending-topics-container .play-pause-wrapper,
  #root .trending-topics-container .play-pause-wrapper,
  .trending-topics-container .play-pause-wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-top: 14px;
    margin-bottom: 0;
    padding-left: 2px;
    padding-right: 0;
    box-sizing: border-box;
  }

  #react_0HNJTIFDCDQFG .trending-topics-container .pause-button,
  #root .trending-topics-container .pause-button,
  .trending-topics-container .pause-button,
  #react_0HNJTIFDCDQFG .trending-topics-container .play-button,
  #root .trending-topics-container .play-button,
  .trending-topics-container .play-button {
    flex: 0 0 auto;
    margin-top: 38px;
    margin-left: 0;
    margin-right: auto;
  }
}