/* DeepSeek Harness — mobile / narrow-viewport responsive overrides.
 *
 * The shell collapses the sidebar to a 56px rail below 1024px (see
 * dsh-client-ui-layout SIDEBAR_AUTO_COLLAPSE), but the conversation surface is
 * still desktop-tuned: hardcoded 748px chat content width, 32px message gutters,
 * a cramped input toolbar, and a decorative hero glow that overflows narrow
 * columns. These rules polish phone/tablet reading without touching desktop.
 *
 * NOTE: class names below are the CSS-module hashes for this build (0.1.0-rc.6);
 * they are injected at runtime by client plugins, so every override here uses
 * !important to win the cascade regardless of injection order.
 */

/* ------------------------------------------------------------------ */
/* Below the shell's 1024px sidebar auto-collapse                      */
/* ------------------------------------------------------------------ */
@media (max-width: 1023px) {
  /* Decorative hero glow is 135% wide and forces internal overflow; drop it. */
  .wSkVaW_heroGlow {
    display: none !important;
  }

  /* Keep the conversation scroll region from ever growing a horizontal axis. */
  .wSkVaW_scrollBody,
  .wSkVaW_composerSeat {
    overflow-x: hidden !important;
  }

  /* Header drops its desktop-only right gutter. */
  .wSkVaW_header {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .wSkVaW_headerUtilities {
    margin-left: 8px !important;
  }

  /* Empty-state ("new session") hero: tighter horizontal padding. */
  .pXSMma_root {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .wSkVaW_heroWorkspaceRow {
    padding-left: 12px !important;
  }
}

/* ------------------------------------------------------------------ */
/* Phones                                                              */
/* ------------------------------------------------------------------ */
@media (max-width: 640px) {
  /* Give the message column more room: the default gutter is 16px + 16px. */
  .Md3f7G_scroll {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* ---- Input toolbar: stop the mode selector from sliding under the
         model selector. Keep the left tools fixed-size, let the model
         trigger shrink and truncate instead. ---- */
  .uV2eYG_row {
    gap: 8px !important;
  }
  .uV2eYG_tools {
    flex: 0 0 auto !important;
    gap: 8px !important;
  }
  .uV2eYG_trailing {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    gap: 8px !important;
  }
  ._7KE1Ra_root {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  ._7KE1Ra_trigger {
    max-width: 100% !important;
  }
  ._7KE1Ra_triggerLabel {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Slightly larger touch targets for the two primary composer controls. */
  .uV2eYG_add {
    width: 32px !important;
    height: 32px !important;
  }
  .uV2eYG_primary {
    width: 36px !important;
    height: 36px !important;
  }

  /* The details column becomes a full-width sheet on phones (the layout
     solver now gives it the whole center track); drop its edge border so it
     reads as a panel rather than a sliver. */
  .pI_x6G_detailsCol {
    border-left: none !important;
  }
}

/* ------------------------------------------------------------------ */
/* Coarse pointers (touch): comfortable tap targets everywhere         */
/* ------------------------------------------------------------------ */
@media (pointer: coarse) {
  .uV2eYG_add,
  .uV2eYG_primary {
    min-width: 34px !important;
    min-height: 34px !important;
  }
}