/* =====================================================================
   style.css — テキスト差分 ツール固有の微調整のみ。
   共通スタイルは /_shared/shirugear.css に任せる。
   ===================================================================== */

.sg-textarea {
  min-height: 160px;
  resize: vertical;
  line-height: 1.6;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* 入力を横並び（狭い画面では縦積み） */
.sg-diff-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sg-space-3);
}

@media (max-width: 600px) {
  .sg-diff-inputs {
    grid-template-columns: 1fr;
  }
}

/* インラインチェック */
.sg-check {
  display: flex;
  align-items: flex-start;
  gap: var(--sg-space-2);
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1.4;
}

.sg-check input[type="checkbox"] {
  margin-top: 0.15em;
  width: 1.1em;
  height: 1.1em;
  flex: 0 0 auto;
  accent-color: var(--sg-primary, #3b5bdb);
  cursor: pointer;
}

/* 差分行表示 */
.sg-difflines {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9rem;
  line-height: 1.6;
  border: 1px solid var(--sg-border, #dde2ec);
  border-radius: var(--sg-radius, 10px);
  overflow: hidden;
}

.sg-diffline {
  display: flex;
  align-items: baseline;
  gap: 0.5em;
  padding: 0.1em 0.6em;
  white-space: pre-wrap;
  word-break: break-word;
}

.sg-diffline__sign {
  flex: 0 0 1.2em;
  text-align: center;
  font-weight: 700;
  user-select: none;
  color: var(--sg-muted, #5a6473);
}

.sg-diffline__text {
  flex: 1 1 auto;
}

/* 追加（B のみ）= 緑 */
.sg-diffline.is-add {
  background: #e3f7e0;
}
.sg-diffline.is-add .sg-diffline__sign {
  color: #1f7a33;
}

/* 削除（A のみ）= 赤 */
.sg-diffline.is-del {
  background: #fce4e4;
}
.sg-diffline.is-del .sg-diffline__sign {
  color: #b3261e;
}

/* 共通 = 地のまま */
.sg-diffline.is-same {
  background: #fff;
}

.sg-diffline.is-empty {
  color: var(--sg-muted, #5a6473);
  font-style: italic;
}

/* サマリのカウント色付け */
.sg-count-add {
  color: #1f7a33;
  font-weight: 700;
}
.sg-count-del {
  color: #b3261e;
  font-weight: 700;
}
.sg-count-same {
  color: var(--sg-muted, #5a6473);
  font-weight: 700;
}