/* ================================================================
   FSB Agropecuária — Dashboard
   main.css  –  Todos os estilos consolidados do index.html
   ================================================================ */


/* ── Login ── */

#fsb-login-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: linear-gradient(135deg, #1b5e20 0%, #2e7d32 40%, #388e3c 100%);
  display: flex; align-items: center; justify-content: center;
}
.fsb-login-card {
  background: white; border-radius: 16px; padding: 40px 48px;
  width: 100%; max-width: 420px; box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.fsb-login-logo { text-align: center; margin-bottom: 28px; }
.fsb-login-logo .logo-icon { font-size: 3rem; display: block; margin-bottom: 8px; }
.fsb-login-logo h2 { font-size: 1.5rem; font-weight: 700; color: #1b5e20; margin-bottom: 4px; }
.fsb-login-logo p { font-size: 0.85rem; color: #78909c; margin: 0; }
.fsb-login-card label { font-size: 0.82rem; font-weight: 600; color: #37474f; margin-bottom: 4px; display: block; }
.fsb-login-card input {
  width: 100%; padding: 11px 14px; border: 1.5px solid #cfd8dc;
  border-radius: 8px; font-size: 0.95rem; outline: none;
  transition: border-color .2s; margin-bottom: 16px;
}
.fsb-login-card input:focus { border-color: #2e7d32; }
.fsb-btn-login {
  width: 100%; padding: 12px; background: linear-gradient(135deg, #2e7d32, #1b5e20);
  color: white; border: none; border-radius: 8px; font-size: 0.95rem;
  font-weight: 600; cursor: pointer; transition: opacity .2s; margin-top: 4px;
}
.fsb-btn-login:hover { opacity: 0.9; }
.fsb-btn-login:disabled { opacity: 0.6; cursor: not-allowed; }
#fsb-login-error {
  margin-top: 12px; padding: 10px 14px; background: #ffebee;
  border-left: 3px solid #c62828; border-radius: 4px;
  font-size: 0.83rem; color: #c62828; display: none;
}
.fsb-login-footer { text-align: center; margin-top: 20px; font-size: 0.75rem; color: #b0bec5; }

/* Auth topbar (sobrepõe o header-bar existente) */
#fsb-auth-bar {
  position: fixed; top: 0; right: 0; z-index: 1000;
  display: none; align-items: center; gap: 10px;
  padding: 8px 20px; background: rgba(0,0,0,0.25);
  border-bottom-left-radius: 10px;
}
#fsb-auth-bar .user-email { font-size: 0.78rem; color: rgba(255,255,255,0.9); }
#fsb-auth-bar .badge-role {
  font-size: 0.66rem; padding: 2px 8px; border-radius: 10px;
  font-weight: 700; text-transform: uppercase;
}
.badge-admin  { background: #ff8f00; color: white; }
.badge-editor { background: #1565c0; color: white; }
.badge-viewer { background: rgba(255,255,255,0.25); color: white; }
#fsb-auth-bar .btn-logout {
  background: rgba(255,255,255,0.15); color: white;
  border: 1px solid rgba(255,255,255,0.3); border-radius: 6px;
  padding: 3px 10px; font-size: 0.76rem; cursor: pointer; transition: background .2s;
}
#fsb-auth-bar .btn-logout:hover { background: rgba(255,255,255,0.25); }


/* ── CSS Variables ── */

:root {
  --verde: #2e7d32;
  --verde-light: #4caf50;
  --marrom: #5d4037;
  --amarelo: #f9a825;
  --vermelho: #c62828;
  --azul: #1565c0;
  --cinza-bg: #f5f5f5;
}


/* ── Header ── */

body { background: var(--cinza-bg); font-family: 'Segoe UI', sans-serif; }
.header-bar {
  background: linear-gradient(135deg, var(--verde) 0%, var(--marrom) 100%);
  color: white; padding: 18px 24px;
}
.header-bar h1 { font-size: 1.5rem; margin: 0; font-weight: 700; }
.header-bar small { opacity: 0.8; font-size: 0.85rem; }


/* ── Tabs ── */

.nav-tabs .nav-link { font-weight: 600; color: var(--marrom); }
.nav-tabs .nav-link.active { color: var(--verde); border-bottom: 3px solid var(--verde); }
.tab-content { padding: 20px 0; }


/* ── KPI Cards ── */

.kpi-card {
  border-radius: 12px; padding: 18px 20px; color: white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}
.kpi-card .kpi-value { font-size: 1.8rem; font-weight: 700; line-height: 1; }
.kpi-card .kpi-label { font-size: 0.78rem; opacity: 0.85; margin-top: 4px; }
.kpi-card .kpi-sub { font-size: 0.72rem; opacity: 0.7; margin-top: 2px; }
.bg-verde { background: var(--verde); }
.bg-marrom { background: var(--marrom); }
.bg-amarelo { background: #e65100; }
.bg-azul { background: var(--azul); }
.bg-roxo { background: #6a1b9a; }
.bg-teal { background: #00695c; }


/* ── Tabelas Gerais ── */

table thead th { background: #37474f; color: white; font-size: 0.82rem; white-space: nowrap; }
table tbody td { font-size: 0.83rem; vertical-align: middle; }
.badge-urgente { background: #c62828; color: white; }
.badge-ok { background: #2e7d32; color: white; }
.badge-pendente { background: #e65100; color: white; }
.badge-planejado { background: #1565c0; color: white; }
.badge-vendido { background: #546e7a; color: white; }
.section-title {
  font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: #546e7a; padding: 6px 0 2px;
}
.chart-container { position: relative; }
.real-row { background: #f1f8e9 !important; }
.plan-row { background: #fff8e1 !important; }
.alert-row { background: #ffebee !important; }
.progress-lote { height: 8px; border-radius: 4px; }
tr.highlight-month td { font-weight: 700; background: #e3f2fd !important; }
.card { border-radius: 10px; border: none; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
.footnote { font-size: 0.72rem; color: #78909c; }
.month-label { font-weight: 700; }
.compra-badge { display: inline-block; background: #ffe0b2; color: #e65100; border-radius: 4px; padding: 1px 6px; font-size: 0.75rem; font-weight: 600; }
.venda-badge { display: inline-block; background: #c8e6c9; color: #2e7d32; border-radius: 4px; padding: 1px 6px; font-size: 0.75rem; font-weight: 600; }


/* ── Tabela Vendas (tabVendas) ── */

.vl-mes-header { font-size:0.92rem; font-weight:700; padding:7px 14px; color:white; border-radius:6px; margin-bottom:6px; display:flex; align-items:center; justify-content:space-between }
.vl-mes-real  { background:linear-gradient(90deg,#1b5e20,#388e3c) }
.vl-mes-gap   { background:linear-gradient(90deg,#bf360c,#e64a19) }
.vl-mes-plan  { background:linear-gradient(90deg,#1565c0,#1976d2) }
.vl-mes-ok    { background:linear-gradient(90deg,#37474f,#546e7a) }
.vl-mes-grow  { background:linear-gradient(90deg,#1b5e20,#2e7d32) }
.vl-table th  { font-size:0.68rem; white-space:nowrap; background:#37474f; color:white; padding:5px 8px }
.vl-table td  { font-size:0.71rem; vertical-align:middle; padding:4px 8px }
.vl-total-row td { background:#e8f5e9; font-weight:700; font-size:0.75rem }
.vl-urgente   { background:#ffebee !important }
.vl-conf-row  { background:#f3e5f5 !important }
.vl-tip-row   { background:#e8f5e9 !important }
.vl-comp-row  { background:#fff8e1 !important; font-style:italic }
.vl-badge-saida  { display:inline-block; background:#2e7d32; color:white; border-radius:3px; padding:1px 6px; font-size:0.65rem; font-weight:700 }
.vl-badge-entrada{ display:inline-block; background:#1565c0; color:white; border-radius:3px; padding:1px 6px; font-size:0.65rem; font-weight:700 }
.vl-badge-urg    { display:inline-block; background:#c62828; color:white; border-radius:3px; padding:1px 6px; font-size:0.65rem; font-weight:700; animation:pulse-urg2 1.2s infinite }
.vl-kpi { font-size:0.72rem; opacity:0.9 }


/* ── Plano Operacional (tab3) ── */

.pl-mes { background: #37474f; color: white; font-weight: 700; font-size: 0.95rem; padding: 8px 14px; border-radius: 8px 8px 0 0; margin-top: 18px; margin-bottom: 0; display: flex; align-items: center; gap: 8px; }
.pl-table { width: 100%; border-collapse: collapse; margin-bottom: 4px; }
.pl-table th { background: #546e7a; color: white; font-size: 0.78rem; padding: 5px 10px; text-align: left; }
.pl-table th.right { text-align: right; }
.pl-table td { font-size: 0.81rem; padding: 4px 10px; border-bottom: 1px solid #e0e0e0; vertical-align: middle; }
.pl-table td.right { text-align: right; }
.pl-row-venda { background: #f1f8e9; }
.pl-row-fase { background: #fff8e1; }
.pl-row-compra { background: #e3f2fd; }
/* fonte CSV */
.pl-row-conf { background: #ffebee; }
.pl-badge { display: inline-block; border-radius: 4px; padding: 1px 7px; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.pl-badge-venda { background: #c8e6c9; color: #1b5e20; }
.pl-badge-tip { background: #fff9c4; color: #e65100; }
.pl-badge-sp3 { background: #ffe0b2; color: #bf360c; }
.pl-badge-sp1 { background: #e1f5fe; color: #01579b; }
.pl-badge-conf { background: #ffcdd2; color: #b71c1c; }
.pl-badge-compra { background: #bbdefb; color: #0d47a1; }
.pl-total { background: #eceff1; font-weight: 700; font-size: 0.82rem; }
.pl-urgente { color: #c62828; font-weight: 700; }
.pl-obs { font-size: 0.72rem; color: #78909c; font-style: italic; }
.pl-wrap { border: 1px solid #cfd8dc; border-radius: 0 0 8px 8px; overflow: hidden; }


/* ── Lotes (tabLotes) ── */

.lt-toolbar { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.lt-btn { border:none; border-radius:5px; padding:5px 14px; font-size:0.78rem; font-weight:700; cursor:pointer; }
.lt-btn-add  { background:#1565c0; color:white; }
.lt-btn-clr  { background:#546e7a; color:white; }
.lt-table-wrap { overflow-x:auto; }
.lt-table { width:100%; border-collapse:collapse; font-size:0.76rem; }
.lt-table th { background:#37474f; color:white; padding:6px 8px; white-space:nowrap; text-align:left; }
.lt-table td { border:1px solid #cfd8dc; padding:4px 6px; vertical-align:middle; }
.lt-table tr:nth-child(even) td { background:#f5f5f5; }
.lt-table input[type=text], .lt-table input[type=number] {
  width:100%; border:1px solid #b0bec5; border-radius:3px; padding:2px 5px;
  font-size:0.75rem; box-sizing:border-box; background:white;
}
.lt-table input[type=date] {
  width:120px; border:1px solid #b0bec5; border-radius:3px; padding:2px 4px; font-size:0.75rem;
}
.lt-table select {
  border:1px solid #b0bec5; border-radius:3px; padding:2px 4px; font-size:0.75rem;
  width:100%; background:white;
}
.lt-prev  { font-size:0.72rem; color:#1565c0; font-weight:600; white-space:nowrap; }
.lt-venda { font-size:0.72rem; color:#1b5e20; font-weight:700; white-space:nowrap; }
.lt-urgente { color:#c62828; font-weight:700; }
.lt-del { background:none; border:none; color:#c62828; cursor:pointer; font-size:1rem; padding:0 4px; }
.lt-badge-dieta { display:inline-block; border-radius:3px; padding:1px 5px; font-size:0.62rem; font-weight:700; color:white; }
.lt-d-sp   { background:#1565c0; }
.lt-d-tip  { background:#6a1b9a; }
.lt-d-conf { background:#1b5e20; }


/* ── Calculadora (tab5) ── */

.calc-section { background:#f5f5f5; border-radius:8px; padding:14px; margin-bottom:14px }
.calc-section h6 { font-size:0.8rem; font-weight:700; margin-bottom:8px; color:#37474f; text-transform:uppercase; letter-spacing:.5px }
.calc-label { font-size:0.72rem; font-weight:600; color:#546e7a; margin-bottom:2px }
.calc-result-box { border-radius:6px; padding:10px 14px; margin-bottom:8px }
.cr-verde  { background:#e8f5e9; border-left:4px solid #2e7d32 }
.cr-roxo   { background:#f3e5f5; border-left:4px solid #6a1b9a }
.cr-verde-escuro { background:#1b5e20; color:white; border-radius:6px; padding:12px }
.cr-azul   { background:#e3f2fd; border-left:4px solid #1565c0 }
.cr-laranja { background:#fff3e0; border-left:4px solid #e65100 }
.cr-cinza  { background:#eceff1; border-left:4px solid #546e7a }
.cr-vermelho { background:#ffebee; border-left:4px solid #c62828 }
.phase-row { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px }
.phase-pill { display:flex; flex-direction:column; align-items:center; border-radius:6px;
              padding:6px 10px; font-size:0.68rem; min-width:80px; text-align:center }
.phase-pill strong { font-size:0.78rem }
.pp-rec  { background:#0277bd; color:white }
.pp-sp   { background:#1565c0; color:white }
.pp-seca { background:#00695c; color:white }
.pp-tip  { background:#6a1b9a; color:white }
.pp-conf { background:#1b5e20; color:white }
.pp-venda { background:#c62828; color:white }
.phase-arr { color:#9e9e9e; font-size:1.1rem; line-height:2.2rem; flex-shrink:0 }
.timeline-bar { height:6px; border-radius:3px; margin-bottom:2px }
.radio-group label { font-size:0.75rem; cursor:pointer; user-select:none }
.radio-group input { cursor:pointer }

/* Timeline de fases (tab5) */
.tl-fase-wrap   { display:flex; align-items:stretch; gap:0; overflow-x:auto; padding:6px 0 12px }
.tl-fase-blk    { display:flex; flex-direction:column; align-items:center; min-width:110px;
                  flex-shrink:0; position:relative }
.tl-fase-bar    { height:10px; width:100%; border-radius:0; flex-shrink:0 }
.tl-fase-bar:first-child { border-radius:5px 0 0 5px }
.tl-fase-bar:last-child  { border-radius:0 5px 5px 0 }
.tl-fase-dot    { width:14px; height:14px; border-radius:50%; border:2px solid white;
                  margin-top:-12px; z-index:1; flex-shrink:0 }
.tl-fase-label  { font-size:0.65rem; font-weight:700; margin-top:4px; text-align:center; line-height:1.2 }
.tl-fase-sub    { font-size:0.6rem; color:#78909c; text-align:center; line-height:1.2 }
.tl-fase-date   { font-size:0.68rem; font-weight:700; margin-top:2px; text-align:center }
.tl-fase-peso   { font-size:0.62rem; color:#546e7a; text-align:center }
.tl-fase-arr    { font-size:1.2rem; color:#b0bec5; align-self:center; padding:0 1px; flex-shrink:0; margin-top:-8px }
.tl-compra-pin  { background:#1565c0 }
.tl-sp-pin      { background:#1565c0 }
.tl-tip-pin     { background:#6a1b9a }
.tl-conf-pin    { background:#1b5e20 }
.tl-venda-pin   { background:#c62828 }


/* ── Viabilidade (tab6) ── */

.vb-card        { background:#fafafa; border:1px solid #e0e0e0; border-radius:8px; padding:14px; margin-bottom:12px }
.vb-section     { background:#f5f5f5; border-radius:6px; padding:10px 14px; margin-bottom:10px }
.vb-label       { font-size:0.75rem; color:#546e7a; margin-bottom:2px }
.vb-input       { width:100%; font-size:0.85rem; padding:4px 8px; border:1px solid #bdbdbd; border-radius:4px; background:#fff }
.vb-input:focus { outline:2px solid #1565c0; border-color:#1565c0 }
.vb-input.amarelo { background:#fffde7; border-color:#f9a825 }
.vb-result-box  { border-radius:8px; padding:12px 16px; text-align:center }
.vb-kpi-val     { font-size:1.5rem; font-weight:700; line-height:1.1 }
.vb-kpi-lbl     { font-size:0.7rem; color:#546e7a; margin-top:2px }
.vb-fase        { border-radius:6px; padding:8px 10px; font-size:0.75rem; margin-bottom:6px }
.vb-fase-title  { font-weight:700; font-size:0.8rem; margin-bottom:4px }
.vb-verde       { background:#e8f5e9; border-left:4px solid #2e7d32 }
.vb-amarelo     { background:#fff8e1; border-left:4px solid #f9a825 }
.vb-vermelho    { background:#ffebee; border-left:4px solid #c62828 }
.vb-roxo        { background:#f3e5f5; border-left:4px solid #6a1b9a }
.vb-azul        { background:#e3f2fd; border-left:4px solid #1565c0 }
.vb-pipeline    { display:flex; align-items:center; gap:0; flex-wrap:nowrap; overflow-x:auto; margin:10px 0 }
.vb-pip-seg     { display:flex; flex-direction:column; align-items:center; min-width:100px; padding:6px 8px;
                  border-radius:5px; font-size:0.68rem; line-height:1.3; text-align:center; flex-shrink:0 }
.vb-pip-arr     { font-size:1.1rem; color:#78909c; padding:0 2px; flex-shrink:0 }
.vb-table       { width:100%; font-size:0.78rem; border-collapse:collapse }
.vb-table th    { background:#37474f; color:white; padding:5px 8px; text-align:left }
.vb-table td    { padding:4px 8px; border-bottom:1px solid #eeeeee }
.vb-table tr:last-child td { border-bottom:none }
.vb-table .num  { text-align:right; font-variant-numeric:tabular-nums }
.semaforo-ok    { color:#2e7d32; font-weight:700 }
.semaforo-warn  { color:#f9a825; font-weight:700 }
.semaforo-bad   { color:#c62828; font-weight:700 }
.vb-nota        { font-size:0.7rem; color:#78909c; margin-top:6px }


/* ── Fases/Parâmetros (tab7) ── */

.tf-section { margin-bottom:18px }
.tf-title { font-size:0.82rem; font-weight:700; padding:6px 10px; border-radius:5px 5px 0 0; margin:0 }
.tf-sp  { background:#1565c0; color:white }
.tf-tip { background:#6a1b9a; color:white }
.tf-conf { background:#1b5e20; color:white }
.tf-table { width:100%; border-collapse:collapse; font-size:0.75rem }
.tf-table th { background:#eceff1; color:#37474f; padding:5px 8px; text-align:left; border:1px solid #cfd8dc; white-space:nowrap }
.tf-table td { border:1px solid #cfd8dc; padding:4px 8px; vertical-align:middle }
.tf-table tr.tf-total td { background:#e8eaf6; font-weight:700 }
.tf-table tr.tf-sp-row td { background:#e3f2fd }
.tf-table tr.tf-tip-row td { background:#f3e5f5 }
.tf-table tr.tf-conf-row td { background:#e8f5e9 }
.tf-num { text-align:right; font-variant-numeric:tabular-nums }
.tf-input { width:80px; border:1px solid #b0bec5; border-radius:3px; padding:2px 5px; font-size:0.74rem; text-align:right }
.tf-calc { color:#1565c0; font-weight:600 }
.tf-path { border-left:4px solid; padding:10px 12px; border-radius:0 5px 5px 0; margin-bottom:8px; font-size:0.76rem }
.tf-path-tip  { border-color:#6a1b9a; background:#fce4ec }
.tf-path-conf { border-color:#1b5e20; background:#e8f5e9 }
.tf-path-dir  { border-color:#e65100; background:#fff3e0 }
.tf-kpi-row { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:4px }
.tf-kpi { background:white; border-radius:4px; padding:4px 10px; border:1px solid #cfd8dc }
.tf-kpi span { display:block }
.tf-kpi .v { font-size:1.1rem; font-weight:700; color:#1565c0 }
.tf-kpi .l { font-size:0.62rem; color:#78909c }
.tf-arrow { text-align:center; font-size:1.2rem; color:#546e7a; padding:2px 0 }


/* ── Admin ── */

#tabAdmin .real-row   { background: #e8f5e9 !important; }
#tabAdmin .plan-row   { background: #fffde7 !important; }
#tabAdmin .mes-atual td { background: #fff9c4 !important; font-weight: 700; }
#tabAdmin .total-row td { background: #263238 !important; color: white !important; font-weight: 700; }
#tabAdmin .subtotal-row td { background: #455a64 !important; color: white !important; font-weight: 600; }
#tabAdmin .badge-real { background:#2e7d32; color:white; font-size:0.64rem; padding:2px 5px; border-radius:3px; }
#tabAdmin .badge-plan { background:#f9a825; color:#333; font-size:0.64rem; padding:2px 5px; border-radius:3px; }
#tabAdmin .badge-emp  { background:#c62828; color:white; font-size:0.64rem; padding:2px 4px; border-radius:3px; }
#tabAdmin .pos { color: #2e7d32; font-weight: 600; }
#tabAdmin .neg { color: #c62828; font-weight: 600; }
#tabAdmin .cx-ok   { background: #e8f5e9 !important; color: #2e7d32 !important; font-weight: 700; }
#tabAdmin .cx-warn { background: #fff3e0 !important; color: #e65100 !important; font-weight: 700; }
#tabAdmin .cx-red  { background: #ffebee !important; color: #c62828 !important; font-weight: 700; }
#tabAdmin table thead th { background: #37474f; color: white; font-size: 0.78rem; white-space: nowrap; padding: 5px 7px; }
#tabAdmin table tbody td { font-size: 0.78rem; vertical-align: middle; padding: 4px 6px; }
#tabAdmin table tfoot td { font-size: 0.78rem; font-weight: 700; padding: 5px 7px; }
