:root {
  --bc-azul: #1f3a5f;
  --bc-laranja: #f59f00;
  --bc-bottom-h: 64px;
}

body { background: var(--bs-tertiary-bg); }
.bc-navbar { background: var(--bc-azul); }
.bc-navbar .nav-link.active { color: #fff; font-weight: 600; }

/* espaço para a barra inferior no celular */
@media (max-width: 991.98px) {
  .bc-main { padding-bottom: calc(var(--bc-bottom-h) + 24px + env(safe-area-inset-bottom)) !important; }
}

.bc-bottom-nav {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030;
  height: calc(var(--bc-bottom-h) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
  display: flex; align-items: center; justify-content: space-around;
  background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, .06);
}
.bc-bottom-nav a {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
  color: var(--bs-secondary-color); text-decoration: none; font-size: .72rem;
}
.bc-bottom-nav a i { font-size: 1.35rem; }
.bc-bottom-nav a.ativo { color: var(--bc-azul); font-weight: 600; }
[data-bs-theme="dark"] .bc-bottom-nav a.ativo { color: var(--bc-laranja); }
.bc-bottom-nav .bc-fab {
  flex: 0 0 60px; height: 60px; margin-top: -28px; border-radius: 50%;
  background: var(--bc-laranja); color: #212529; justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
}
.bc-bottom-nav .bc-fab i { font-size: 1.9rem; }
.bc-badge {
  position: absolute; top: -2px; left: 55%; background: var(--bs-danger); color: #fff;
  border-radius: 10px; font-size: .65rem; padding: 0 6px; font-weight: 700;
}

/* cartões de indicadores */
.bc-kpi { border: 0; border-radius: .9rem; }
.bc-kpi .rotulo { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); }
.bc-kpi .valor { font-size: 1.45rem; font-weight: 700; line-height: 1.2; }
.bc-kpi.destaque { background: var(--bc-azul); color: #fff; }
.bc-kpi.destaque .rotulo { color: rgba(255, 255, 255, .75); }
.card { border-radius: .8rem; }

.bc-dot { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; vertical-align: middle; }
.bc-valor { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* lista de lançamentos no celular */
.bc-item { display: flex; gap: .75rem; align-items: center; padding: .7rem .9rem; color: inherit; text-decoration: none; }
.bc-item + .bc-item { border-top: 1px solid var(--bs-border-color-translucent); }
.bc-item:hover { background: var(--bs-secondary-bg); }
.bc-item .desc { font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.bc-item .meta { font-size: .78rem; color: var(--bs-secondary-color); }

/* visão planilha */
.bc-planilha { font-size: .85rem; }
.bc-planilha th, .bc-planilha td { white-space: nowrap; text-align: right; padding: .45rem .55rem; }
.bc-planilha th:first-child, .bc-planilha td:first-child {
  text-align: left; position: sticky; left: 0; z-index: 2; background: var(--bs-body-bg);
  box-shadow: 1px 0 0 var(--bs-border-color);
}
.bc-planilha thead th { background: var(--bc-azul) !important; color: #fff; font-weight: 600; font-size: .75rem; }
.bc-planilha td.celula { cursor: pointer; }
.bc-planilha td.celula:hover { background: rgba(245, 159, 0, .18); }
.bc-planilha td.vazia { color: var(--bs-tertiary-color); }
.bc-planilha .total { font-weight: 700; background: var(--bs-secondary-bg) !important; }
.bc-planilha tfoot td { font-weight: 700; background: var(--bs-secondary-bg); }

/* formulário de lançamento: alvos grandes para o dedo */
.bc-form .form-control, .bc-form .form-select { min-height: 48px; font-size: 1rem; }
.bc-form .valor-grande { font-size: 1.6rem; font-weight: 700; }
.bc-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.bc-chips input { display: none; }
.bc-chips label {
  border: 1px solid var(--bs-border-color); border-radius: 2rem; padding: .45rem .85rem;
  cursor: pointer; user-select: none; font-size: .9rem; background: var(--bs-body-bg);
}
.bc-chips input:checked + label { background: var(--bc-azul); border-color: var(--bc-azul); color: #fff; }
.d-contents { display: contents; }
.bc-thumb { width: 84px; height: 84px; object-fit: cover; border-radius: .5rem; border: 1px solid var(--bs-border-color); }

.htmx-indicator { display: none; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display: inline-block; }

.bc-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--bc-azul), #10203a); }
