/* Máy tính quy đổi (Figma: Open Caculator) — thay chỗ khung tin nhắn, Pin
   Area và composer. Cột trái: tiền tệ dự án (xanh), cột phải: đồng mặc định
   (vàng). Số canh hai phía của mũi nhọn giữa hai cột. */
.app.calc-open > .thread-wrap,
.app.calc-open > .expense-composer,
.app.calc-open > .coins{display:none}
.calc-view{
  flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  background:var(--color-background-secondary);
}
.calc-view[hidden]{display:none}

/* dải tỉ giá: Text-field section trên nền green/100, vạch 1px ở đáy */
.calc-rate{
  display:flex; align-items:flex-end; gap:var(--spacing-8);
  padding:var(--spacing-12) var(--spacing-16);
  background:var(--green-100);
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.12);
}
.calc-rate .text-field__input{font-variant-numeric:tabular-nums}
.calc-rate .text-field__input:read-only{background:var(--color-background-primary); color:var(--color-text-secondary)}

/* bảng: Elevation/Hairline */
.calc-table{filter:drop-shadow(0 .5px .5px rgba(0,0,0,.08))}
.calc-row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.calc-cell{
  font:var(--text-body-xl); letter-spacing:var(--tracking-body-xl);
  color:var(--color-text-primary); font-variant-numeric:tabular-nums;
  padding:var(--spacing-16) var(--spacing-32); min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.calc-cell--from{background:var(--green-100); text-align:right}
.calc-cell--to{background:var(--yellow-50); display:flex; align-items:center}
.calc-row--head .calc-cell{font:var(--text-body-xl-emphasis); letter-spacing:var(--tracking-body-xl-emphasis)}
.calc-row--head .calc-cell--from{background:var(--green-200); position:relative; overflow:visible; z-index:1}
.calc-row--head .calc-cell--to{background:var(--yellow-100)}
/* mũi nhọn 16px của ô tiêu đề trái, đè lên ô tiêu đề phải */
.calc-row--head .calc-cell--from::after{
  content:""; position:absolute; top:0; bottom:0; right:-16px; width:16px;
  background:inherit; clip-path:polygon(0 0, 100% 50%, 0 100%);
}
.calc-cell--custom{padding:var(--spacing-16) var(--spacing-12); overflow:visible}
.calc-cell--custom .text-field__input{text-align:left; font-variant-numeric:tabular-nums}
