/* Folha dos Fabricantes (PCP). Mesmo visual da Folha de Fabricantes do
   FinanceiroFlow, para as duas telas lerem igual. Cor sempre com texto ou
   ícone: verde = igual à regra, âmbar = diferente / a conferir, vermelho =
   sem regra, azul = informação e ação. */
.fsm-shell { max-width: 1640px; margin: 0 auto; color: #16233a; }
.fsm-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin-bottom: .8rem; }
.fsm-head h2 { font-size: 1.3rem; margin: 0; color: #16233a; }
.fsm-head p { font-size: .78rem; color: #5c6b81; margin: .2rem 0 0; }
.fsm-semana { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.fsm-semana button { height: 34px; border: 1px solid #cbd3df; background: #fff; color: #26344b; border-radius: 6px; padding: 0 .6rem; font-size: .75rem; }
.fsm-semana button:hover { background: #f1f5fa; }
.fsm-semana input { height: 34px; border: 1px solid #cbd3df; border-radius: 6px; padding: 0 .5rem; font-size: .78rem; color: #16233a; }
.fsm-semana-txt { font-size: .74rem; color: #5c6b81; margin-bottom: .5rem; }
.fsm-semana-txt b { color: #16233a; }

.fsm-fonte { display: flex; align-items: flex-start; gap: .5rem; font-size: .74rem; color: #5c6b81; background: #fff; border: 1px solid #e0e5ed; border-radius: 8px; padding: .5rem .75rem; margin-bottom: .8rem; }
.fsm-fonte.warn { background: #fffaef; border-color: #f0e2b9; color: #6b4e06; }
.fsm-fonte.danger { background: #fdf3f3; border-color: #f0cfcf; color: #8a1f1f; }
.fsm-fonte i { margin-top: .05rem; }

.fsm-kpis { display: grid; grid-template-columns: repeat(6, minmax(140px, 1fr)); gap: .7rem; margin-bottom: .8rem; }
.fsm-kpi { background: #fff; border: 1px solid #e0e5ed; border-left: 4px solid #cbd3df; border-radius: 8px; padding: .75rem .8rem; min-width: 0; }
.fsm-kpi.good { border-left-color: #1f9d55; }
.fsm-kpi.warn { border-left-color: #c98a09; }
.fsm-kpi.danger { border-left-color: #d33c3c; }
.fsm-kpi-label { font-size: .66rem; color: #707d92; text-transform: uppercase; letter-spacing: .04em; }
.fsm-kpi-value { font-size: 1.12rem; font-weight: 750; color: #16233a; margin: .3rem 0 .2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fsm-kpi-note { font-size: .68rem; color: #7b8799; line-height: 1.35; }

.fsm-card { background: #fff; border: 1px solid #e0e5ed; border-radius: 10px; margin-bottom: .8rem; min-width: 0; }
.fsm-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; flex-wrap: wrap; padding: .7rem .9rem; border-bottom: 1px solid #eef1f5; }
.fsm-card-head h3 { font-size: .9rem; margin: 0; color: #16233a; }
.fsm-card-head small { display: block; font-size: .7rem; color: #7b8799; margin-top: .1rem; }
.fsm-count { font-size: .7rem; color: #5c6b81; white-space: nowrap; }
.fsm-card-body { padding: .7rem .9rem; }

.fsm-pend { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: .4rem .75rem; padding: .55rem 0; border-bottom: 1px solid #f1f3f7; font-size: .76rem; }
.fsm-pend:last-child { border-bottom: 0; }
.fsm-pend > i { font-size: .95rem; }
.fsm-pend .danger { color: #d33c3c; }
.fsm-pend .warn { color: #c98a09; }
.fsm-pend .info { color: #1769d2; }
.fsm-pend-txt b { color: #16233a; }
.fsm-pend-txt small { display: block; color: #7b8799; font-size: .68rem; margin-top: .1rem; }
.fsm-pend-nomes { display: block; color: #7b8799; font-size: .68rem; margin-top: .1rem; }
.fsm-pend-val { text-align: right; font-weight: 700; white-space: nowrap; }

.fsm-btn { height: 30px; border: 1px solid #1769d2; background: #fff; color: #1769d2; border-radius: 6px; padding: 0 .65rem; font-size: .72rem; font-weight: 700; white-space: nowrap; }
.fsm-btn:hover { background: #eef5ff; }
.fsm-btn.prim { background: #1769d2; color: #fff; }
.fsm-btn.prim:hover { background: #125bb8; }
.fsm-btn.perigo { border-color: #b42318; color: #b42318; }
.fsm-btn.perigo:hover { background: #fdf3f3; }
.fsm-btn:disabled { opacity: .55; cursor: default; }

.fsm-vazio { padding: 1.3rem .9rem; text-align: center; color: #5c6b81; font-size: .76rem; }
.fsm-vazio b { display: block; color: #16233a; font-size: .84rem; margin-bottom: .15rem; }
.fsm-vazio.good b { color: #1f7a45; }
.fsm-vazio.mini { padding: .7rem; text-align: left; }
.fsm-carregando { padding: 2.5rem; text-align: center; color: #5c6b81; font-size: .8rem; }
.fsm-recarregando { opacity: .45; pointer-events: none; transition: opacity .15s; }

.fsm-filtros { display: flex; align-items: flex-end; gap: .6rem; flex-wrap: wrap; background: #fff; border: 1px solid #e0e5ed; border-radius: 10px; padding: .6rem .75rem; margin-bottom: .8rem; }
.fsm-filtro label { display: block; font-size: .65rem; font-weight: 700; color: #5c6b81; margin-bottom: .2rem; }
.fsm-filtro select, .fsm-filtro input { height: 32px; font-size: .76rem; border: 1px solid #cbd3df; border-radius: 6px; padding: 0 .5rem; color: #16233a; background: #fff; }
.fsm-filtro.busca { flex: 1 1 220px; }
.fsm-filtro.busca input { width: 100%; }
.fsm-ativo { display: inline-flex; align-items: center; gap: .5rem; background: #eef5ff; border: 1px solid #cfe0f7; border-radius: 6px; padding: .28rem .55rem; font-size: .72rem; color: #26344b; margin: 0 .4rem .6rem 0; }
.fsm-ativo button { border: 1px solid #1769d2; background: #fff; color: #1769d2; border-radius: 5px; font-size: .66rem; font-weight: 700; padding: .08rem .45rem; }

.fsm-tbl-wrap { overflow-x: auto; max-width: 100%; }
.fsm-tbl { width: 100%; border-collapse: collapse; font-size: .74rem; }
.fsm-tbl th { background: #f7f9fc; color: #5c6b81; font-size: .64rem; text-transform: uppercase; letter-spacing: .03em; font-weight: 700; padding: .5rem .55rem; border-bottom: 1px solid #e5e9ef; text-align: left; white-space: nowrap; }
.fsm-tbl th.ord { cursor: pointer; user-select: none; }
.fsm-tbl th.ord:hover { color: #16233a; }
.fsm-tbl th.grp { border-left: 1px solid #e5e9ef; }
.fsm-tbl td { padding: .5rem .55rem; border-bottom: 1px solid #f0f2f6; vertical-align: top; white-space: nowrap; }
.fsm-tbl td.grp { border-left: 1px solid #f0f2f6; }
.fsm-tbl th.num, .fsm-tbl td.num { text-align: right; }
.fsm-tbl tbody tr.clic { cursor: pointer; }
.fsm-tbl tbody tr.clic:hover { background: #f6f9ff; }
.fsm-tbl tbody tr.sel { background: #eef5ff; }
.fsm-tbl tfoot td { font-weight: 750; background: #f7f9fc; border-top: 1px solid #e5e9ef; }
.fsm-tbl thead tr.sup th { background: #fff; border-bottom: 0; padding-bottom: 0; text-transform: none; letter-spacing: 0; font-size: .66rem; color: #1769d2; }
.fsm-nome { font-weight: 650; color: #16233a; max-width: 300px; overflow: hidden; text-overflow: ellipsis; display: block; }
.fsm-sub { display: block; font-size: .66rem; color: #7b8799; margin-top: .1rem; font-weight: 400; }
.fsm-neg { color: #c92a2a; }
.fsm-zero { color: #9aa5b5; }
.fsm-regra { display: block; font-size: .66rem; color: #7b8799; margin-top: .15rem; max-width: 220px; white-space: normal; }

.fsm-tag { display: inline-flex; align-items: center; gap: .25rem; border-radius: 999px; padding: .12rem .45rem; font-size: .64rem; font-weight: 700; background: #eef1f5; color: #4a586d; }
.fsm-tag.ok { background: #e6f5ec; color: #1f7a45; }
.fsm-tag.open { background: #e8f0fd; color: #1d4ed8; }
.fsm-tag.warn { background: #fdf3dc; color: #8a5a00; }
.fsm-tag.bad { background: #fde8e8; color: #b42318; }
.fsm-tags { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .2rem; }

.fsm-como { font-size: .74rem; color: #5c6b81; margin: .2rem 0 1rem; }
.fsm-como summary { cursor: pointer; color: #1769d2; font-weight: 650; }
.fsm-como ul { margin: .5rem 0 0; padding-left: 1.1rem; line-height: 1.55; max-width: 110ch; }
.fsm-procedencia { font-size: .7rem; color: #7b8799; margin: 0 0 1rem; }

/* ── painel do detalhe, sobreposto à direita ── */
.fsm-ov { position: fixed; left: 0; right: 0; bottom: 0; top: var(--nav-h, 52px); z-index: 1055; display: flex; justify-content: flex-end; }
.fsm-ov-fundo { position: absolute; inset: 0; background: rgba(22, 35, 58, .38); }
.fsm-ov-painel { position: relative; width: min(1180px, calc(100vw - 48px)); height: 100%; background: #fff; box-shadow: -6px 0 24px rgba(0, 0, 0, .18); display: flex; flex-direction: column; min-width: 0; }
.fsm-ov-painel .fsm-card-head { flex: 0 0 auto; }
.fsm-ov-corpo { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: .8rem .9rem 1.2rem; }
.fsm-ov-fechar { display: inline-flex; align-items: center; gap: .3rem; }

.fsm-det-sec { min-width: 0; margin-top: 1rem; }
.fsm-ov-corpo > .fsm-det-sec:first-child { margin-top: 0; }
.fsm-det-sec h4 { font-size: .76rem; margin: 0 0 .35rem; color: #16233a; }
.fsm-det-sec h4 small { font-weight: 400; color: #7b8799; margin-left: .3rem; }
.fsm-det-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: 1rem; }
.fsm-det-grid .fsm-det-sec { margin-top: 0; }

.fsm-caixas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: .2rem; }
.fsm-caixas > div { background: #f7f9fc; border-radius: 7px; padding: .5rem .6rem; min-width: 0; border: 1px solid transparent; }
.fsm-caixas > div.atual { border-color: #1769d2; background: #f3f8ff; }
.fsm-caixas label { display: block; font-size: .6rem; text-transform: uppercase; color: #7b8799; }
.fsm-caixas strong { display: block; font-size: .84rem; color: #16233a; margin-top: .15rem; white-space: nowrap; }
.fsm-caixas .fsm-sub { white-space: normal; overflow-wrap: anywhere; }
.fsm-nota { font-size: .68rem; color: #7b8799; margin-top: .4rem; line-height: 1.45; }

.fsm-acoes { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .6rem; }
.fsm-acoes.rente { margin-top: 0; }
.fsm-acoes small { font-size: .68rem; color: #7b8799; }
.fsm-trava { display: flex; gap: .5rem; align-items: flex-start; font-size: .72rem; color: #6b4e06; background: #fffaef; border: 1px solid #f0e2b9; border-radius: 6px; padding: .4rem .6rem; margin-top: .6rem; }
.fsm-trava.info { color: #26344b; background: #f3f8ff; border-color: #cfe0f7; }

.fsm-form { margin-top: .6rem; padding: .6rem .7rem; border: 1px solid #cfe0f7; background: #f6faff; border-radius: 8px; display: grid; gap: .45rem; max-width: 640px; }
.fsm-form-tit { font-size: .76rem; }
.fsm-form label { font-size: .68rem; font-weight: 700; color: #26344b; }
.fsm-form input, .fsm-form textarea { border: 1px solid #cbd3df; border-radius: 6px; padding: .3rem .5rem; font-size: .78rem; color: #16233a; background: #fff; }
.fsm-form input { width: 150px; text-align: right; font-variant-numeric: tabular-nums; }
.fsm-form textarea { width: 100%; min-height: 54px; }
.fsm-form input::placeholder, .fsm-form textarea::placeholder { color: #b3bac0; font-style: italic; text-align: left; }
.fsm-form [aria-invalid=true] { border-color: #d33c3c; }
.fsm-form-nota { font-size: .7rem; color: #5c6b81; }
.fsm-form-nota.fora { color: #8a5a00; font-weight: 650; }
.fsm-form-msg { font-size: .72rem; color: #8a1f1f; background: #fdf3f3; border: 1px solid #f0cfcf; border-radius: 6px; padding: .35rem .55rem; }

@media (max-width: 1280px) {
  .fsm-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fsm-caixas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) { .fsm-det-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) {
  .fsm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fsm-kpi-value { font-size: 1rem; }
  .fsm-head h2 { font-size: 1.1rem; }
  .fsm-semana { width: 100%; }
  .fsm-pend { grid-template-columns: auto 1fr; }
  .fsm-pend-val { grid-column: 2; text-align: left; }
  .fsm-pend .fsm-btn { grid-column: 2; justify-self: start; }
  .fsm-caixas { grid-template-columns: 1fr; }
  .fsm-form input { width: 100%; }
  .fsm-ov-painel { width: 100%; }
  .fsm-ov-corpo { padding: .7rem .7rem 1rem; }
}