.app-fin{
  font-family:"Poppins",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

.app-fin-dashboard-scope{
  max-width:1200px;
  margin:auto;
}

.app-fin-dash-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:20px;
}

.app-fin-dash-title{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.app-fin-dash-h1{
  font-weight:700;
  font-size:20px;
  color:#111827;
}

.app-fin-dash-sub{
  font-size:12px;
  color:#6b7280;
}

.app-fin-dash-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

.app-fin-dashboard-widget{
  background:#fff;
  border-radius:20px;
  box-shadow:0 12px 34px rgba(15,23,42,.08);
  border:1px solid rgba(17,24,39,.06);
  overflow:hidden;
}

.app-fin-dashboard-widget-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:16px 18px;
  background:#f8fafc;
  border-bottom:1px solid rgba(17,24,39,.06);
}

.app-fin-dashboard-widget-head h3{
  margin:0;
  font-size:15px;
  font-weight:700;
  color:#111827;
}

.app-fin-dashboard-widget-head p{
  margin:4px 0 0;
  font-size:12px;
  color:#6b7280;
}

.app-fin-dashboard-widget-period{
  font-size:12px;
  font-weight:700;
  color:#111827;
  background:#fff;
  border:1px solid rgba(17,24,39,.08);
  border-radius:999px;
  padding:6px 10px;
}

.app-fin-dashboard-widget-body{
  padding:18px;
}

.app-fin-dashboard-skeleton{
  font-size:13px;
  color:#6b7280;
}

.app-fin-dashboard-empty{
  border:1px dashed rgba(17,24,39,.10);
  border-radius:16px;
  padding:16px;
  text-align:center;
  font-size:12px;
  font-weight:600;
  color:#6b7280;
  background:#f9fafb;
}

/* alertas */
.app-fin-dashboard-alert{
  border:1px solid transparent;
  border-radius:16px;
  padding:14px 16px;
}

.app-fin-dashboard-alert + .app-fin-dashboard-alert{
  margin-top:12px;
}

.app-fin-dashboard-alert .alert-title{
  font-size:13px;
  font-weight:700;
  margin-bottom:4px;
}

.app-fin-dashboard-alert .alert-text{
  font-size:13px;
  line-height:1.45;
}

.app-fin-dashboard-alert.is-success{
  background:rgba(16,185,129,.10);
  border-color:rgba(16,185,129,.18);
  color:#047857;
}

.app-fin-dashboard-alert.is-warning{
  background:rgba(249,115,22,.10);
  border-color:rgba(249,115,22,.18);
  color:#c2410c;
}

.app-fin-dashboard-alert.is-danger{
  background:rgba(239,68,68,.10);
  border-color:rgba(239,68,68,.18);
  color:#b91c1c;
}

.app-fin-dashboard-alert.is-default{
  background:rgba(17,24,39,.05);
  border-color:rgba(17,24,39,.08);
  color:#111827;
}

/* pendencias */
.app-fin-dashboard-pendencias-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}

.app-fin-dashboard-pendencia{
  border-radius:16px;
  padding:16px;
  border:1px solid rgba(17,24,39,.06);
  background:#fff;
}

.app-fin-dashboard-pendencia .kicker{
  font-size:12px;
  color:#6b7280;
  margin-bottom:8px;
}

.app-fin-dashboard-pendencia .main{
  font-size:28px;
  font-weight:700;
  line-height:1;
  margin-bottom:8px;
}

.app-fin-dashboard-pendencia .sub{
  font-size:12px;
  font-weight:600;
}

.app-fin-dashboard-pendencia.is-danger{ background:rgba(239,68,68,.06); }
.app-fin-dashboard-pendencia.is-warning{ background:rgba(249,115,22,.06); }
.app-fin-dashboard-pendencia.is-positive{ background:rgba(16,185,129,.06); }
.app-fin-dashboard-pendencia.is-card{ background:rgba(99,102,241,.06); }
.app-fin-dashboard-pendencia.is-neutral{ background:rgba(17,24,39,.04); }

/* ações pendentes */
.app-fin-dashboard-pending-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.app-fin-dashboard-pending-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px 16px;
  border:1px solid rgba(17,24,39,.06);
  border-radius:18px;
  background:linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
  box-shadow:0 8px 18px rgba(15,23,42,.04);
}

.app-fin-dashboard-pending-main{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
}

.app-fin-dashboard-pending-title{
  font-size:15px;
  font-weight:700;
  line-height:1.25;
  color:#111827;
  margin:0;
}

.app-fin-dashboard-pending-desc{
  font-size:12px;
  line-height:1.45;
  color:#6b7280;
}

.app-fin-dashboard-pending-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
}

.app-fin-dashboard-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  border:1px solid rgba(17,24,39,.08);
  background:#fff;
  font-size:10px;
  font-weight:700;
  color:#374151;
  white-space:nowrap;
}

.app-fin-dashboard-pill.is-danger{
  background:rgba(239,68,68,.08);
  border-color:rgba(239,68,68,.16);
  color:#b91c1c;
}

.app-fin-dashboard-pill.is-positive{
  background:rgba(16,185,129,.08);
  border-color:rgba(16,185,129,.16);
  color:#047857;
}

.app-fin-dashboard-pill.is-category{
  background:rgba(99,102,241,.08);
  border-color:rgba(99,102,241,.14);
  color:#4338ca;
}

.app-fin-dashboard-pill.is-date{
  background:rgba(17,24,39,.04);
  border-color:rgba(17,24,39,.08);
  color:#374151;
}

.app-fin-dashboard-pending-side{
  flex:0 0 auto;
  min-width:140px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:10px;
}

.app-fin-dashboard-pending-value{
  font-size:24px;
  line-height:1;
  font-weight:800;
  color:#111827;
  white-space:nowrap;
  letter-spacing:-0.02em;
  text-align:right;
}

.app-fin-dashboard-inline-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:92px;
  height:36px;
  padding:0 14px;
  border:1px solid rgba(16,185,129,.12);
  border-radius:12px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  background:#10b981;
  color:#fff;
  box-shadow:0 8px 16px rgba(16,185,129,.16);
}

.app-fin-dashboard-inline-action:hover{
  background:#059669;
  border-color:#059669;
  color:#fff;
}

.app-fin-dashboard-inline-action:disabled{
  opacity:.6;
  cursor:not-allowed;
  box-shadow:none;
}

/* fatura */
.app-fin-dashboard-fatura-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:18px;
}

.app-fin-dashboard-fatura-main .label,
.app-fin-dashboard-fatura-side .mini-label{
  font-size:12px;
  color:#6b7280;
  margin-bottom:6px;
}

.app-fin-dashboard-fatura-main .value{
  font-size:30px;
  font-weight:700;
  color:#111827;
}

.app-fin-dashboard-fatura-side{
  min-width:120px;
  text-align:right;
}

.app-fin-dashboard-fatura-side .mini-value{
  font-size:28px;
  font-weight:700;
  color:#111827;
}

.app-fin-dashboard-stack{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.app-fin-dashboard-stack .row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font-size:13px;
  color:#111827;
}

.app-fin-dashboard-stack .row strong{
  font-size:13px;
}

.app-fin-dashboard-stack .row.is-divergencia{
  margin-top:8px;
  padding-top:10px;
  border-top:1px solid rgba(17,24,39,.06);
}

/* resumo */
.app-fin-dashboard-resumo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
  margin-bottom:18px;
}

.app-fin-dashboard-resumo-block{
  border-radius:16px;
  padding:16px;
  border:1px solid rgba(17,24,39,.06);
  background:#fff;
}

.app-fin-dashboard-resumo-block .kicker{
  font-size:12px;
  color:#6b7280;
  margin-bottom:8px;
}

.app-fin-dashboard-resumo-block .value{
  font-size:28px;
  font-weight:700;
  color:#111827;
}

.app-fin-dashboard-resumo-block .value.is-positive{ color:#047857; }
.app-fin-dashboard-resumo-block .value.is-negative{ color:#b91c1c; }

.app-fin-dashboard-flow-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.flow-row .top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font-size:13px;
  color:#111827;
  margin-bottom:6px;
}

.flow-row .top strong{
  font-size:13px;
}

/* ações */
.app-fin-dashboard-actions-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
}

.app-fin-dashboard-action{
  border:1px solid rgba(17,24,39,.06);
  background:#fff;
  border-radius:16px;
  padding:16px;
  text-align:left;
  cursor:pointer;
}

.app-fin-dashboard-action .title{
  display:block;
  font-size:14px;
  font-weight:700;
  color:#111827;
  margin-bottom:6px;
}

.app-fin-dashboard-action .desc{
  display:block;
  font-size:12px;
  color:#6b7280;
}

.app-fin-dashboard-action.is-positive{ background:rgba(16,185,129,.05); }
.app-fin-dashboard-action.is-warning{ background:rgba(249,115,22,.06); }
.app-fin-dashboard-action.is-card{ background:rgba(99,102,241,.06); }
.app-fin-dashboard-action.is-neutral{ background:rgba(17,24,39,.04); }

/* bars */
.bar{
  width:100%;
  height:10px;
  background:#eef2f7;
  border-radius:999px;
  overflow:hidden;
}

.bar-fill{
  display:block;
  height:100%;
  border-radius:999px;
}

.bar-fill.is-positive{ background:#10b981; }
.bar-fill.is-positive-soft{ background:#34d399; }
.bar-fill.is-danger{ background:#ef4444; }
.bar-fill.is-warning{ background:#f59e0b; }
.bar-fill.is-card{ background:#6366f1; }
.bar-fill.is-card-soft{ background:#818cf8; }

@media (max-width: 767px){
  .app-fin-dash-head{
    flex-direction:column;
    align-items:stretch;
  }

  .app-fin-dashboard-widget-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .app-fin-dashboard-fatura-top{
    flex-direction:column;
    align-items:flex-start;
  }

  .app-fin-dashboard-fatura-side{
    text-align:left;
  }

  .app-fin-dashboard-pending-row{
    flex-direction:column;
    align-items:stretch;
  }

  .app-fin-dashboard-pending-main{
    width:100%;
  }

  .app-fin-dashboard-pending-side{
    width:100%;
    min-width:0;
    align-items:flex-start;
  }

  .app-fin-dashboard-pending-value{
    text-align:left;
  }

  .app-fin-dashboard-inline-action{
    width:100%;
  }
}