/* Painel da plataforma: só o que o CSS do sistema (granja.css) não cobre. Mesma paleta, mesmos componentes. */

/* ── Login: painel da marca à esquerda, formulário à direita ─────────────── */
/* A imagem da marca é 4:3 e o nome "Agrotecs" ocupa ~72% da largura: a coluna é larga (62%) para o "cover" não cortar
   as letras. Em telas abaixo de 1100px o painel da marca some e fica só o formulário (com o logo no topo). */
.pl-wrap { display: grid; grid-template-columns: 1.6fr 1fr; min-height: 100vh; font-family: 'Poppins', system-ui, sans-serif; }
.pl-marca { background: linear-gradient(180deg, #012114 0%, #00160c 100%) center / cover no-repeat; position: relative; }
.pl-marca::before { content: ''; position: absolute; inset: 0; background: url('/painel-assets/login-marca.webp') center / cover no-repeat; }
.pl-marca::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,0) 80%, rgba(0,0,0,.16)); }
@media (max-width: 1100px) { .pl-wrap { grid-template-columns: 1fr; } .pl-marca { display: none; } }
.pl-form { display: flex; align-items: center; justify-content: center; padding: 32px 24px; background: #fff; }
.pl-card { width: 100%; max-width: 380px; }
.pl-logo { display: block; width: 240px; max-width: 80%; height: auto; margin: 0 auto 26px; }
.pl-titulo { font-size: 1.25rem; font-weight: 700; color: #0f172a; text-align: center; margin: 0 0 4px; }
.pl-sub { font-size: .85rem; color: #64748b; text-align: center; margin: 0 0 28px; }
.pl-campo { margin-bottom: 18px; }
.pl-campo label { display: block; font-size: .74rem; font-weight: 600; color: #475569; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
.pl-input { position: relative; }
.pl-input i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: #94a3b8; font-size: 1rem; }
.pl-input input { width: 100%; padding: 12px 14px 12px 40px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; font: inherit; font-size: .92rem; color: #0f172a; transition: border .2s, background .2s; }
.pl-input input:focus { outline: none; border-color: var(--primary, #1BA2BA); background: #fff; box-shadow: 0 0 0 3px rgba(27, 162, 186, .15); }
.pl-btn { width: 100%; padding: 13px; border: 0; border-radius: 10px; background: var(--primary, #1BA2BA); color: #fff; font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer; transition: filter .2s; }
.pl-btn:hover { filter: brightness(1.07); }
.pl-erro { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; border-radius: 10px; padding: 10px 14px; font-size: .84rem; margin-bottom: 18px; }
.pl-rodape { text-align: center; font-size: .74rem; color: #94a3b8; margin-top: 26px; }
@media (max-width: 860px) { .pl-wrap { grid-template-columns: 1fr; } .pl-marca { display: none; } }

/* ── Menu lateral: marca (ícone + nome em texto, legível no fundo escuro) ── */
.pn-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.pn-brand img { width: 36px; height: 36px; flex-shrink: 0; }
.pn-brand span { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 1.12rem; color: #fff; letter-spacing: -.3px; white-space: nowrap; }
.pn-brand span b { color: #8dd63c; font-weight: 800; }
.sidebar.collapsed .pn-brand span { display: none; }
.pn-selo { font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8dd63c; background: rgba(141, 214, 60, .12); padding: 2px 8px; border-radius: 99px; margin-left: 4px; }
.sidebar.collapsed .pn-selo { display: none; }

/* ── Cabeçalho ───────────────────────────────────────────────────────────── */
.pn-sair { display: inline; margin: 0; }
.pn-sair button { background: transparent; border: 0; cursor: pointer; font: inherit; }

/* ── Componentes pequenos ────────────────────────────────────────────────── */
.pn-aviso { color: var(--text-muted, #64748b); font-size: .84rem; }
.pn-sub { margin: 24px 0 4px; font-size: 1rem; }
#formCliente .table input[type="date"], #formCliente .table input[type="number"] { width: 100%; }
.pn-dica { color: var(--text-muted, #64748b); font-size: .76rem; margin: -10px 0 16px; }
.pn-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pn-acoes form { display: inline; margin: 0; }
.pn-tag-teste { font-size: .72rem; color: var(--text-muted, #64748b); }
.pn-chave { font-family: ui-monospace, Consolas, monospace; font-size: 1rem; background: #0f172a; color: #e2e8f0; border-radius: 10px; padding: 16px; word-break: break-all; user-select: all; }
.pn-senha-box { font-family: ui-monospace, Consolas, monospace; font-size: 1.3rem; font-weight: 700; background: #0f172a; color: #8dd63c; border-radius: 10px; padding: 14px 18px; letter-spacing: .04em; user-select: all; }
.pn-slug { font-family: ui-monospace, Consolas, monospace; background: var(--primary-light, #e8f7fa); color: var(--primary-dark, #158fa5); padding: 2px 8px; border-radius: 6px; font-size: .82rem; }
.pn-addon { display: flex; align-items: stretch; }
.pn-addon input { border-radius: 8px 0 0 8px !important; flex: 1; min-width: 0; }
.pn-addon span { display: flex; align-items: center; padding: 0 12px; background: #f1f5f9; border: 1px solid var(--border-color, #e2e8f0); border-left: 0; border-radius: 0 8px 8px 0; font-size: .82rem; color: #64748b; white-space: nowrap; }
.pn-lista-passos { margin: 8px 0 0 18px; padding: 0; font-size: .88rem; color: #334155; }
.pn-lista-passos li { margin-bottom: 6px; }
.pn-cmd { display: block; font-family: ui-monospace, Consolas, monospace; font-size: .8rem; background: #0f172a; color: #e2e8f0; padding: 10px 12px; border-radius: 8px; margin-top: 6px; user-select: all; word-break: break-all; }
.pn-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .pn-grid-2 { grid-template-columns: 1fr; } }
.row-muted td { opacity: .55; }