/* Seshat app-specific styles, layered over vendored Bootstrap 5 (light).
   Bootstrap owns components (cards, forms, tables, badges, navbar, progress);
   everything here is an app-only class with no Bootstrap counterpart. Never
   restyle Bootstrap's own class names in this file. */

/* --- auth pages (base.html) --- */
.wrap { max-width: 640px; margin: 0 auto; padding: 2rem 1rem 3rem; }
.brand h1 { font-size: 1.4rem; letter-spacing: 0.02em; }

/* --- headings inside cards (templates use h2/h3/h4 semantically) --- */
.card h2 { font-size: 1.15rem; }
.card h3 { font-size: 1rem; }
.card h4, .tile h4 { font-size: 0.95rem; margin-bottom: 0.4rem; }

/* --- section header: title left, status right --- */
.section-head { display: flex; align-items: baseline; justify-content: space-between;
  gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.section-head h3 { margin: 0; }

/* --- numeric table cells --- */
.num { text-align: right; font-variant-numeric: tabular-nums; }

/* --- KPI tiles (overview, buckets) --- */
.tiles { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.tile { background: var(--bs-body-bg); border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem; padding: 0.9rem; }
.tile .kpi { display: flex; justify-content: space-between; font-size: 0.85rem;
  padding: 0.15rem 0; color: var(--bs-secondary-color); }
.tile .kpi b { color: var(--bs-body-color); }
@media (min-width: 560px) {
  .tiles { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
.pos { color: var(--bs-success-text-emphasis); }
.neg { color: var(--bs-danger-text-emphasis); }

/* --- deductibility split bar --- */
.split-bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden;
  margin-top: 0.3rem; background: var(--bs-tertiary-bg);
  border: 1px solid var(--bs-border-color); }
.split-bar .s { background: var(--bs-success); }
.split-bar .m { background: var(--bs-warning); }
.split-bar .n { background: var(--bs-danger); }

/* --- bucket cards grid --- */
.bucket-grid { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
@media (min-width: 560px) {
  .bucket-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
}

/* --- transaction filters row --- */
.filters { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.75rem;
  align-items: center; }
.filters input, .filters select { width: auto; flex: 1 1 8rem; min-width: 0; }
.filters .chk { font-size: 0.8rem; display: inline-flex; align-items: center;
  gap: 0.25rem; }
.filters .chk input { width: auto; flex: none; }

/* --- misc app pieces --- */
.why { font-size: 0.7rem; margin-top: 0.2rem; max-width: 220px; }
.row-actions { display: flex; flex-direction: column; gap: 0.35rem;
  align-items: flex-start; }
.row-actions .rename { display: flex; gap: 0.25rem; align-items: center; }
.row-actions .rename input { width: 9rem; padding: 0.2rem 0.35rem; font-size: 0.8rem; }
.grid-2 { display: grid; grid-template-columns: 1fr; gap: 0 1rem; }
@media (min-width: 761px) { .grid-2 { grid-template-columns: 1fr 1fr; } }
.checks { display: flex; gap: 1.25rem; flex-wrap: wrap; margin: 0.5rem 0 0.75rem; }
.answer { white-space: pre-wrap; font-size: 0.9rem; line-height: 1.5; }
.qr { display: block; width: 200px; height: 200px; background: #fff; padding: 8px;
  border-radius: 8px; border: 1px solid var(--bs-border-color); }
.secret code { background: var(--bs-tertiary-bg); padding: 0.2rem 0.4rem;
  border-radius: 6px; }
.entities { list-style: none; padding: 0; }
.entities li { padding: 0.4rem 0; border-bottom: 1px solid var(--bs-border-color); }
.disclaimer { margin-top: 2rem; font-size: 0.78rem; color: var(--bs-secondary-color); }

/* --- floating bug / feature report widget --- */
.reportfab { position: fixed; right: 1rem; bottom: 1rem; z-index: 1030; }
#reportbox { position: fixed; right: 1rem; bottom: 1rem; z-index: 1040; width: 340px;
  max-width: calc(100vw - 2rem); }
@media (max-width: 599px) { #reportbox { left: 1rem; right: 1rem; width: auto;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); } }
.report-head { display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 0.5rem; }
.report-tabs { display: flex; gap: 0.375rem; }
.report-tab { border: 1px solid var(--bs-border-color); background: var(--bs-tertiary-bg);
  color: var(--bs-body-color); border-radius: 999px; padding: 0.3rem 0.8rem;
  font-size: 0.85rem; cursor: pointer; min-height: 32px; }
.report-tab.active { background: var(--bs-primary); border-color: var(--bs-primary); color: #fff; }
#report-text { margin: 0.375rem 0; }
.report-foot { display: flex; justify-content: space-between; align-items: center;
  gap: 0.5rem; margin-top: 0.5rem; }
.report-thumbs { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.375rem 0; }
.report-thumb { position: relative; display: inline-block; }
.report-thumb img { width: 56px; height: 56px; object-fit: cover; border-radius: 0.375rem;
  border: 1px solid var(--bs-border-color); display: block; }
.report-thumb button { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px;
  border-radius: 50%; border: 0; background: var(--bs-dark); color: #fff; font-size: 11px;
  line-height: 1; cursor: pointer; padding: 0; }