/* 狭い画面・タッチ端末の上書き。**最後に読む**（同じ強さの指定はここが勝つ） */

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 768px) {
  .charts {
    grid-template-columns: minmax(0, 1fr);
  }
  .rank-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .cal-cell {
    min-height: 52px;
    padding: 4px;
  }
  .cal-day-num { font-size: var(--text-2xs); }
  .cal-day-amount { font-size: var(--text-2xs); }
  .na-comp-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* ============================================================
   狭い画面での行の折り返し
   ------------------------------------------------------------
   横1列で組んである行は、幅が足りなくなると縮まずに画面外へ出る。
   **項目を隠すのではなく2行に折り返す**＝狭い画面でも情報は減らさない。
   ============================================================ */
@media (max-width: 560px) {
  /* やること: チェック＋タグ＋本文で1行目を使い、遅れ・期日・「明日へ」は2行目へ回す。
     引くのは1行目の先客ぶん＝チェック17 + 余白12 + タグ列 5.2em(57) + 余白12 = 98px */
  .tsk-row { flex-wrap: wrap; row-gap: 8px; }
  .tsk-row-main { flex: 1 1 calc(100% - 98px); }
  .tsk-row .tsk-due, .tsk-row .tsk-over, .tsk-row .fxc-skip { margin-left: 0; }
  .tsk-row .mst-edit-icon { margin-left: auto; }

  /* 純資産の保有一覧: 構成比バーを名前の下（2行目）へ回す */
  .na-hold { grid-template-columns: 8px minmax(0, 1fr) auto 44px; gap: 6px 10px; }
  .na-hold-bar { grid-column: 2 / -1; }
}

/* ============================================================
   タッチ端末（ホバーが無い）
   ------------------------------------------------------------
   ホバーで初めて出るものは、**指では永久に出せない**。
   支出行の ✏️複製🗑 は行ホバーのオーバーレイなので、スマホからは
   編集も削除もできなかった＝常時表示に切り替える（列は横スクロールできる）。
   ============================================================ */
@media (hover: none) {
  .row-actions-hover {
    position: static; opacity: 1; pointer-events: auto;
    transform: none; padding-left: 0; background: none;
  }
  .row-actions-hover .row-act { pointer-events: auto; }
  .row-act-cell { white-space: nowrap; }

  /* 行が押せることの目印。ホバーで出す前提の ✏️ や掴み手を薄く出しておく */
  .tsk-row .mst-edit-icon { opacity: 0.5; }
  .fxc-row .fxc-drag,
  .mst-fund-card .mst-fund-grip { opacity: 0.45; }
  .sub-del-btn { opacity: 0.6; }
}