/* Reports screen and the date field of the add form. Colors come from the bundle's tokens. */
.rep-title{font-size:20px;font-weight:700;margin:4px 2px 12px;color:var(--text)}
.rep-modes{display:flex;gap:4px;padding:4px;margin-bottom:12px;border-radius:var(--radius-md);background:var(--white-soft);border:1px solid var(--line)}
.rep-mode{flex:1;min-width:0;padding:9px 2px;border:none;border-radius:11px;background:transparent;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rep-mode.active{background:var(--blue-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--blue-border)}
.rep-custom{display:flex;align-items:center;gap:8px;margin:0 0 6px}
.rep-date{flex:1;min-width:0;color-scheme:dark;padding:10px;font-size:15px}
.rep-dash{color:var(--muted)}
.rep-body{transition:opacity .15s ease}
.rep-loading{opacity:.55}
.rep-empty{text-align:center;padding:40px 0}
.rep-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 12px}
.rep-tile{padding:12px 10px;border-radius:var(--radius-xl);background:#1e202eb8;border:1px solid var(--line);min-width:0}
.rep-tile-title{font-size:12px;color:var(--muted);margin-bottom:6px}
.rep-tile-amount{display:flex;flex-direction:column;gap:2px;font-size:15px;font-weight:700;overflow-wrap:anywhere}
.rep-expense .rep-tile-amount{color:var(--danger)}
.rep-income .rep-tile-amount{color:var(--success)}
.rep-savings .rep-tile-amount{color:#73daca}
.rep-zero{color:var(--muted);font-weight:400}
.rep-currencies{margin:0 0 4px}
.rep-bars-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:10px}
.rep-avg{font-size:12px;color:var(--muted);text-align:right}
.rep-bars{display:flex;align-items:flex-end;gap:2px;height:120px}
.rep-bar-col{flex:1;min-width:0;height:100%;display:flex;flex-direction:column}
.rep-bar-track{flex:1;display:flex;align-items:flex-end}
.rep-bar{width:100%;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#bb9af7,#7aa2f7)}
.rep-bar-label{height:16px;margin-top:4px;font-size:10px;color:var(--muted);text-align:center;white-space:nowrap;overflow:visible}
.rep-count{color:var(--muted);font-size:12px}
.rep-section-title{margin:20px 2px 2px;font-size:14px;font-weight:700;color:var(--muted)}
.rep-day-head{margin-top:14px;padding:6px 2px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line)}
.rep-tx{padding:12px 2px}
.rep-tx .tx-sub{font-size:16px}
.rep-tx .tx-amount{font-size:16px}
.rep-amount-income{color:var(--success)}
.rep-amount-savings{color:#73daca}
.report-open-btn{flex:0 0 auto;width:40px;height:40px;border:none;border-radius:14px;background:var(--line);color:var(--text);font-size:19px;line-height:1;cursor:pointer}
/* Date of a new operation in the add form */
.tx-date-row{display:flex;align-items:center;gap:10px;margin-top:8px;padding:0 4px;color:var(--muted);font-size:14px}
.tx-date-input{flex:1;min-width:0;padding:9px 10px;border-radius:12px;border:1px solid var(--line);background:var(--white-soft);color:var(--text);font:inherit;font-size:15px;color-scheme:dark}
.tx-date-today{padding:8px 10px;border-radius:11px;border:1px solid var(--line);background:transparent;color:var(--muted);font-size:13px;cursor:pointer}
.rep-label{text-transform:none}
.rep-label::first-letter{text-transform:uppercase}
.report-open-spacer{flex:0 0 40px}
/* Result of a sum typed in the amount field, shown dimmed inside the field */
.input-col-main{position:relative}
.calc-result{position:absolute;right:16px;top:50%;transform:translateY(-50%);max-width:45%;font-size:18px;color:var(--muted);opacity:.75;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calc-result:empty{display:none}
