/* Brotas 3D — poucas cores: branco, grafite e um laranja de destaque */
:root { --fundo:#ffffff; --tinta:#1e293b; --suave:#f1f5f9; --borda:#e2e8f0; --destaque:#ea580c; --cinza:#64748b; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; background:var(--fundo); color:var(--tinta); }
a { color:var(--destaque); text-decoration:none; }
a:hover { text-decoration:underline; }
.topo { background:var(--tinta); color:#fff; padding:0 24px; display:flex; align-items:center; gap:24px; height:56px; }
.topo .logo { font-weight:800; font-size:18px; color:#fff; letter-spacing:.5px; }
.topo .logo span { color:var(--destaque); }
.topo nav { display:flex; gap:4px; flex-wrap:wrap; }
.topo nav a { color:#cbd5e1; padding:6px 10px; border-radius:6px; font-size:14px; }
.topo nav a:hover, .topo nav a.ativo { background:#334155; color:#fff; text-decoration:none; }
.conteudo { max-width:1280px; margin:0 auto; padding:24px; }
h1 { font-size:22px; margin:0 0 16px; } h2 { font-size:17px; }
.cartoes { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; margin-bottom:22px; }
.cartao { background:var(--suave); border:1px solid var(--borda); border-radius:10px; padding:14px 16px; }
.cartao .num { font-size:26px; font-weight:800; } .cartao .rot { font-size:12.5px; color:var(--cinza); }
.cartao.destaque .num { color:var(--destaque); }
table.lista { width:100%; border-collapse:collapse; font-size:14px; background:#fff; }
table.lista th { text-align:left; font-size:12px; text-transform:uppercase; color:var(--cinza); padding:8px 10px; border-bottom:2px solid var(--borda); }
table.lista td { padding:9px 10px; border-bottom:1px solid var(--borda); vertical-align:middle; }
table.lista tr:hover td { background:var(--suave); }
.badge { color:#fff; font-size:11.5px; padding:3px 9px; border-radius:20px; font-weight:600; white-space:nowrap; }
.botao { display:inline-block; background:var(--destaque); color:#fff !important; border:0; padding:9px 16px; border-radius:8px; font-size:14px; font-weight:600; cursor:pointer; }
.botao:hover { filter:brightness(.92); text-decoration:none !important; }
.botao.claro { background:var(--suave); color:var(--tinta) !important; border:1px solid var(--borda); }
.botao.perigo { background:#dc2626; }
.botao.mini { padding:5px 10px; font-size:12.5px; }
input, select, textarea { font:inherit; padding:8px 10px; border:1px solid var(--borda); border-radius:8px; width:100%; background:#fff; color:var(--tinta); }
label { font-size:13px; font-weight:600; display:block; margin:10px 0 4px; }
form.linha { display:flex; gap:8px; align-items:end; flex-wrap:wrap; } form.linha > * { width:auto; }
.grade { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px; }
.caixa { background:#fff; border:1px solid var(--borda); border-radius:10px; padding:18px; }
.aviso { background:#fffbeb; border:1px solid #fde68a; padding:10px 14px; border-radius:8px; font-size:14px; margin:12px 0; }
.ok { background:#f0fdf4; border:1px solid #bbf7d0; padding:10px 14px; border-radius:8px; font-size:14px; margin:12px 0; }
.kanban { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:start; }
.kanban .coluna { background:var(--suave); border-radius:10px; padding:12px; }
.kanban .coluna h3 { margin:0 0 10px; font-size:14px; }
.kcard { background:#fff; border:1px solid var(--borda); border-radius:8px; padding:10px; margin-bottom:8px; font-size:13px; }
.paginacao { margin:18px 0; display:flex; gap:6px; flex-wrap:wrap; }
.paginacao a, .paginacao span { padding:6px 11px; border:1px solid var(--borda); border-radius:6px; font-size:13.5px; }
.paginacao span.atual { background:var(--tinta); color:#fff; border-color:var(--tinta); }
/* vitrine */
.vitrine { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:18px; }
.prod { border:1px solid var(--borda); border-radius:10px; overflow:hidden; background:#fff; }
.prod img { width:100%; aspect-ratio:1; object-fit:cover; background:var(--suave); display:block; }
.prod .info { padding:12px; }
.prod .nome { font-size:13.5px; font-weight:600; min-height:36px; }
.prod .preco { color:var(--destaque); font-weight:800; font-size:17px; margin-top:6px; }
.rodape { border-top:1px solid var(--borda); margin-top:40px; padding:24px; text-align:center; color:var(--cinza); font-size:13px; }
@media (max-width:900px){ .kanban{grid-template-columns:1fr 1fr;} .topo{height:auto;padding:10px 14px;flex-wrap:wrap;} }
@media print { .topo, .nao-imprimir { display:none !important; } }