/* 土地增值稅試算：比照償債能力即時試算，依試算區實際寬度（container query）排版 */
.land-tax-root {
  container-type: inline-size;
  container-name: land-tax;
  min-width: 0;
}

.land-tax-root .land-tax-layout {
  grid-template-columns: minmax(0, 1fr);
}

.land-tax-root .land-tax-inputs,
.land-tax-root .land-tax-card {
  min-width: 0;
}

.land-tax-root .land-tax-result {
  position: static;
}

.land-tax-root .land-tax-card-head {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 10px;
}

/* 欄位：預設一列兩格 */
.land-tax-root .land-tax-grid,
.land-tax-root .land-tax-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.land-tax-root .land-tax-field {
  min-width: 0;
}

.land-tax-root .land-tax-field span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.land-tax-root .land-tax-field input,
.land-tax-root .land-tax-field select {
  width: 100%;
  min-width: 0;
}

.land-tax-root .land-tax-upload {
  grid-template-columns: minmax(0, 1fr) auto;
}

.land-tax-root .land-tax-actions {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 96px), 1fr));
}

/* 試算結果未放側邊時，指標兩欄並排以縮短長度 */
.land-tax-root .land-tax-kpi-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
  row-gap: 0;
}

.land-tax-root .land-tax-kpi-grid div:nth-last-child(2):nth-child(odd) {
  border-bottom: 1px solid #edf2f5;
}

.land-tax-root .land-tax-kpi-grid div:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.land-tax-root .land-tax-kpi-grid strong {
  max-width: none;
}

/* 中寬：基本資料、扣除項目一列三格 */
@container land-tax (min-width: 560px) {
  .land-tax-root .land-tax-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .land-tax-root .land-tax-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* 寬版（試算結果未在側邊）：基本資料十格排成一列五格、扣除項目一列四格 */
@container land-tax (min-width: 820px) and (max-width: 999px) {
  .land-tax-root .land-tax-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .land-tax-root .land-tax-grid:has(#ltTaxMode) {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .land-tax-root .land-tax-kpi-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .land-tax-root .land-tax-kpi-grid div {
    border-bottom: 1px solid #edf2f5 !important;
  }
}

/* 夠寬時試算結果放右側並固定，指標改回單欄清單 */
@container land-tax (min-width: 1000px) {
  .land-tax-root .land-tax-layout {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
  }

  .land-tax-root .land-tax-result {
    position: sticky;
    top: 12px;
  }

  .land-tax-root .land-tax-kpi-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .land-tax-root .land-tax-kpi-grid div,
  .land-tax-root .land-tax-kpi-grid div:nth-last-child(2):nth-child(odd) {
    border-bottom: 1px solid #edf2f5;
  }

  .land-tax-root .land-tax-kpi-grid div:last-child {
    border-bottom: 0;
  }
}

/* 窄版：仍維持兩欄，縮小內距與大數字 */
@container land-tax (max-width: 420px) {
  .land-tax-root .land-tax-grid {
    gap: 8px;
    padding: 10px;
  }

  .land-tax-root .land-tax-upload {
    grid-template-columns: minmax(0, 1fr);
    padding: 10px;
  }

  .land-tax-root .land-tax-result-main strong {
    font-size: 36px;
  }

  .land-tax-root .land-tax-kpi-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .land-tax-root .land-tax-kpi-grid div,
  .land-tax-root .land-tax-kpi-grid div:nth-last-child(2):nth-child(odd) {
    border-bottom: 1px solid #edf2f5;
  }

  .land-tax-root .land-tax-kpi-grid div:last-child {
    border-bottom: 0;
  }
}

@container land-tax (max-width: 300px) {
  .land-tax-root .land-tax-grid,
  .land-tax-root .land-tax-grid-two {
    grid-template-columns: minmax(0, 1fr);
  }
}
