.botao-sair { border:0; background:transparent; color:var(--marrom-principal); cursor:pointer; font-weight:600; }.botao-sair:hover { color:var(--vermelho-erro); text-decoration:underline; }
:root {
    --marrom-escuro: #5f3f2e;
    --marrom-principal: #7b5138;
    --marrom-claro: #a97c5f;

    --dourado: #c6a064;
    --dourado-claro: #dfc497;

    --bege-fundo: #f6f1ea;
    --bege-claro: #eee5dc;
    --bege-medio: #ded0c2;

    --branco: #ffffff;
    --texto-principal: #332b27;
    --texto-secundario: #746a64;

    --verde-sucesso: #52735d;
    --vermelho-erro: #9d4d4d;

    --sombra-suave: 0 10px 30px rgba(95, 63, 46, 0.10);
}

@media print {
    .catalogo-controles { min-height:78px; padding:18px 150px 18px 4px; background:#fffaf5 !important; border:0; border-bottom:2px solid #c6a064; border-radius:0; box-shadow:none; color:#5f3f2e !important; }
    .catalogo-controles::after { top:5px; right:8px; width:100px; height:88px; }
    .catalogo-controles h2 { color:#5f3f2e !important; font-size:25px; letter-spacing:-.3px; }
    .catalogo-controles p { color:#8b7d72 !important; }
    .catalogo-secao-cabecalho h2 { color:#5f3f2e; }
    .catalogo-secao-cabecalho p { color:#8b7d72; }
    .produto-catalogo { background:#fffdfb; }
}
.tela-login { position:fixed; inset:0; z-index:9999; display:grid; place-items:center; padding:20px; background:linear-gradient(135deg,#5f3f2e,#c6a064); }
.permissoes-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:10px 0; }
.permissoes-grid label { font-size:12px; font-weight:400; }
.linha-usuario { display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--bege-claro); }
.usuarios-layout { display:grid; grid-template-columns:minmax(300px,.8fr) minmax(420px,1.2fr); gap:22px; }.usuario-editor,.usuario-card { padding:25px; background:var(--branco); border:1px solid rgba(123,81,56,.12); border-radius:20px; box-shadow:var(--sombra-suave); margin-bottom:18px; }.usuario-editor-topo,.usuario-card-cabecalho { display:flex; align-items:center; gap:14px; justify-content:space-between; margin-bottom:20px; }.usuario-editor-topo h2 { margin:3px 0; color:var(--marrom-escuro); }.usuario-editor-topo p,.usuario-card small { color:var(--texto-secundario); font-size:12px; }.etiqueta-secao { color:var(--dourado); font-size:10px; font-weight:700; letter-spacing:1.5px; }.icone-usuario,.avatar-usuario { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:var(--bege-claro); color:var(--marrom-principal); font-size:22px; font-weight:700; }.avatar-usuario { flex:none; font-size:17px; }.usuario-card-cabecalho { justify-content:flex-start; }.usuario-card-cabecalho>div:nth-child(2) { flex:1; display:flex; flex-direction:column; gap:3px; }.usuario-card-cabecalho>button { margin-left:auto; }.usuario-campos { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:16px 0; }.usuario-campos input { width:100%; padding:12px 13px; border:1px solid var(--bege-medio); border-radius:10px; }.usuario-editor h3 { margin-top:22px; color:var(--marrom-escuro); font-size:14px; }.permissoes-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0 20px; }.permissao-cartao { display:flex; align-items:center; gap:8px; padding:11px; border:1px solid var(--bege-medio); border-radius:10px; background:var(--branco); color:var(--texto-secundario); cursor:pointer; font-size:11px; text-align:left; }.permissao-cartao span { color:var(--bege-medio); }.permissao-cartao.selecionada { border-color:var(--dourado); background:#fbf5e9; color:var(--marrom-principal); font-weight:700; }.permissao-cartao.selecionada span { color:var(--dourado); }.usuario-card.bloqueado { opacity:.7; }.usuario-card .permissoes-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:900px) { .usuarios-layout { grid-template-columns:1fr; } }
@media (max-width:550px) { .usuario-campos,.permissoes-cards,.usuario-card .permissoes-cards { grid-template-columns:1fr 1fr; } }
.linha-usuario strong { flex:1; }.linha-usuario span { color:var(--texto-secundario); font-size:12px; }
.caixa-login { width:min(100%,410px); display:flex; flex-direction:column; gap:9px; padding:32px; border-radius:22px; background:var(--branco); box-shadow:0 20px 60px rgba(51,43,39,.25); }
.logo-login { display:block; width:220px; height:auto; margin:0 auto 8px; background:transparent; }.caixa-login h1 { color:var(--marrom-escuro); text-align:center; }.caixa-login p { color:var(--texto-secundario); text-align:center; font-size:13px; }.caixa-login label { color:var(--marrom-escuro); font-size:13px; font-weight:600; }.caixa-login input { padding:12px; border:1px solid var(--bege-medio); border-radius:10px; }.caixa-login small { color:var(--texto-secundario); text-align:center; font-size:11px; }.erro-login { min-height:18px; color:var(--vermelho-erro); font-size:12px; text-align:center; }
.acoes-login { display:flex; gap:10px; width:100%; }
.acoes-login .botao-principal,
.acoes-login .botao-principal-invertido {
    flex:1;
    min-width:0;
    width:auto;
    grid-column:auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    text-decoration:none;
    font-family:inherit;
    box-sizing:border-box;
}
.botao-principal-invertido,
a.botao-principal-invertido,
a.botao-principal-invertido:visited {
    background:transparent;
    color:var(--marrom-principal);
    border:1px solid #e2d5c8;
    border-radius:10px;
    padding:13px 22px;
    font-size:14px;
    font-weight:700;
    font-family:inherit;
    cursor:pointer;
    text-decoration:none;
    transition:0.2s;
}
.botao-principal-invertido:hover,
a.botao-principal-invertido:hover {
    background:linear-gradient(135deg, var(--marrom-principal), var(--marrom-escuro));
    color:var(--branco);
    border-color:var(--marrom-principal);
    text-decoration:none;
}
.acoes-login .botao-principal:hover,
.acoes-login .botao-principal-invertido:hover {
    transform:none;
    box-shadow:none;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}
* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: var(--bege-fundo);
    color: var(--texto-principal);
    font-family: Arial, Helvetica, sans-serif;
}

/* Menu lateral */

.sidebar {
    width: 260px;
    min-height: 100vh;
    position: fixed;
    top: 0;
    left: 0;

    display: flex;
    flex-direction: column;

    background:
        linear-gradient(
            180deg,
            var(--marrom-escuro) 0%,
            #3f2b22 100%
        );

    padding: 0 16px 20px;
    box-shadow: 8px 0 30px rgba(63, 43, 34, 0.14);
}

.sidebar button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;

    background: transparent;
    color: rgba(255, 255, 255, 0.82);

    border: 1px solid transparent;
    border-radius: 10px;

    padding: 13px 15px;
    margin-bottom: 5px;

    font-size: 14px;
    text-align: left;
    cursor: pointer;
    transition: 0.2s;
}

.sidebar button:hover {
    background: rgba(198, 160, 100, 0.14);
    color: var(--branco);
    border-color: rgba(198, 160, 100, 0.25);
    transform: translateX(3px);
}

.sidebar button.ativo {
    background: var(--dourado);
    color: var(--marrom-escuro);
    font-weight: 700;
}
.container{
    display:flex;
}
.menu{
    width:260px;
    min-height:100vh;
    background:#181818;
    color:white;
    padding:30px;
}
.menu h1{
    color:#d4af37;
    margin-bottom:5px;
}
.menu p{
    color:#bdbdbd;
    margin-bottom:40px;
}
.menu button{
    width:100%;
    margin-bottom:12px;
    padding:15px;
    border:none;
    border-radius:10px;
    background:#252525;
    color:white;
    cursor:pointer;
    font-size:16px;
    text-align:left;
    transition:.3s;
}
.menu button:hover{
    background:#d4af37;
    color:black;
}
main{
    flex:1;
    padding:40px;
}
header{
    margin-bottom:40px;
}
header h2{
    font-size:32px;
}
header p{
    color:gray;
}
.cards{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}
.card {
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.10);
    border-radius: 16px;
    padding: 22px;
    box-shadow: var(--sombra-suave);
    transition: transform 0.2s, box-shadow 0.2s;
}
.card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 35px rgba(95, 63, 46, 0.14);
}
.card h2,
.card h3 {
    color: var(--marrom-escuro);
}

.formulario {
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.10);
    border-radius: 16px;
    padding: 25px;
    margin-bottom: 25px;
    box-shadow: var(--sombra-suave);
}
.campo label {
    display: block;
    color: var(--marrom-escuro);
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 700;
}
.campo input,
.campo select,
.campo textarea {
    width: 100%;
    background: #fffdfb;
    color: var(--texto-principal);
    border: 1px solid var(--bege-medio);
    border-radius: 9px;
    padding: 12px;
    outline: none;
    transition: 0.2s;
}
.campo input:focus,
.campo select:focus,
.campo textarea:focus {
    border-color: var(--dourado);
    box-shadow: 0 0 0 3px rgba(198, 160, 100, 0.15);
}
.botao-principal {
    background:
        linear-gradient(
            135deg,
            var(--marrom-principal),
            var(--marrom-escuro)
        );
    color: var(--branco);
    border: none;
    border-radius: 10px;
    padding: 13px 22px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.2s;
}
.botao-principal:hover {
    background:
        linear-gradient(
            135deg,
            var(--marrom-claro),
            var(--marrom-principal)
        );
}
table {
    width: 100%;
    border-collapse: collapse;
    background: var(--branco);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--sombra-suave);
}
table thead {
    background: var(--marrom-principal);
    color: var(--branco);
}
table th {
    padding: 14px;
    text-align: left;
    font-size: 13px;
}
table td {
    padding: 13px 14px;
    border-bottom: 1px solid var(--bege-claro);
}
table tbody tr:hover {
    background: #fbf8f4;
}
/* Cabeçalho principal */

.cabecalho {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.usuario {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    background: white;
    padding: 12px 18px;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
    font-weight: 600;
}

.usuario .botao-sair {
    padding: 0;
    font-size: 11px;
    font-weight: 500;
}

.usuario span {
    color: var(--marrom-escuro);
    font-size: 13px;
}

/* Cards de resumo do estoque e financeiro */

.resumo-estoque {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}
.resumo-card {
    background: white;
    padding: 25px;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}
.resumo-card h3 {
    color: gray;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 10px;
}
.resumo-card h2 {
    color: #d4af37;
    font-size: 28px;
}

/* Formulário mais organizado */

.formulario {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 22px;
}

.campo {
    margin-bottom: 0;
}

.botao-principal {
    grid-column: 1 / -1;
    width: fit-content;
    min-width: 180px;
    transition: 0.3s;
}

/* Campos em foco */

.campo input:focus,
.campo select:focus {
    outline: none;
    border-color: #d4af37;
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.15);
}

/* Botões dentro das tabelas */

.tabela button {
    border: none;
    background: #181818;
    color: white;
    padding: 9px 14px;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
}
.tabela button:hover {
    background: #b83232;
}

/* Melhorias na tabela */

.tabela tbody tr:hover {
    background: #faf8f0;
}
.tabela small {
    color: gray;
}

/* Área principal */

.area-principal {
    min-width: 0;
    min-height: 100vh;
    background: #dfd0c1;
}

/* Responsividade */

@media (max-width: 1000px) {
    .resumo-estoque {
        grid-template-columns: 1fr;
    }
    .formulario {
        grid-template-columns: 1fr;
    }
    .cards {
        grid-template-columns: 1fr;
    }
    .cabecalho {
        align-items: flex-start;
        flex-direction: column;
    }
}
@media (max-width: 750px) {
    main {
        padding: 20px;
    }

    .tabela {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    header h2 {
        font-size: 26px;
    }

    .card h1 {
        font-size: 32px;
    }
}
/* Calculadora de cera */

.calculadoras-menu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.card-calculadora { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 26px; border: 1px solid rgba(123,81,56,.12); border-radius: 18px; background: var(--branco); box-shadow: var(--sombra-suave); color: var(--marrom-escuro); text-align: left; cursor: pointer; transition: .2s; }
.card-calculadora:hover { transform: translateY(-3px); border-color: var(--dourado); }
.card-calculadora span { font-size: 32px; }.card-calculadora strong { font-size: 18px; }.card-calculadora small { color: var(--texto-secundario); }
@media (max-width: 700px) { .calculadoras-menu { grid-template-columns: 1fr; } }

.difusores-calculadora small {
    display: block;
    margin-top: 6px;
    color: var(--texto-secundario);
    font-size: 12px;
}
.resultado-difusor {
    margin-top: 24px;
    padding: 28px;
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.12);
    border-radius: 20px;
    box-shadow: var(--sombra-suave);
}
.resultado-difusor h2 { margin-bottom: 6px; color: var(--marrom-escuro); }
.resultado-difusor p { color: var(--texto-secundario); }
.resultado-difusor-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 20px;
}
.resultado-difusor-cards div {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 20px;
    border-radius: 14px;
    background: var(--bege-fundo);
}
.resultado-difusor-cards span { color: var(--texto-secundario); font-size: 13px; }
.resultado-difusor-cards strong { color: var(--marrom-principal); font-size: 26px; }
@media (max-width: 650px) { .resultado-difusor-cards { grid-template-columns: 1fr; } }

.botao-secundario {
    background: transparent;
    color: var(--marrom-principal);
    border: 1px solid var(--dourado);
    border-radius: 10px;
    padding: 12px 22px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.2s;
}
.botao-secundario:hover {
    background: var(--bege-claro);
}
.botao-secundario:hover {
    background: #f8f3df;
}
.resultado-calculadora {
    overflow: hidden;
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.12);
    border-radius: 20px;
    padding: 28px;
    box-shadow: var(--sombra-suave);
}

.dashboard-resumo { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:18px; margin-bottom:24px; }
.catalogo-controles { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; padding:24px; background:linear-gradient(135deg,var(--marrom-escuro),var(--marrom-principal)); color:white; border-radius:20px; box-shadow:var(--sombra-suave); }
.catalogo-pagina { break-after: page; page-break-after: always; margin-bottom: 35px; }
.catalogo-pagina:last-child { break-after: auto; page-break-after: auto; }
.catalogo-secao-cabecalho { margin: 28px 0 18px; }
.catalogo-secao-cabecalho h2 { color: var(--marrom-escuro); margin-bottom: 4px; }
.catalogo-secao-cabecalho p { color: var(--texto-secundario); font-size: 12px; }
.catalogo-controles h2 { color:white; margin-bottom:4px; }.catalogo-controles p { color:rgba(255,255,255,.72); font-size:12px; }.catalogo-acoes { display:flex; gap:10px; }.catalogo-acoes .botao-secundario { background:white; border-color:white; }.catalogo-grade { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.produto-catalogo { display:flex; flex-direction:column; overflow:hidden; background:white; border:1px solid rgba(123,81,56,.1); border-radius:18px; box-shadow:var(--sombra-suave); }.foto-produto { position:relative; display:grid; place-items:center; flex:0 0 220px; height:220px; overflow:hidden; background:linear-gradient(145deg,#f8f1e9,#eee2d7); color:var(--dourado); font-size:60px; }.foto-produto img { display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; }.foto-produto label { position:absolute; right:10px; bottom:10px; z-index:2; padding:7px 10px; border-radius:8px; background:rgba(255,255,255,.92); color:var(--marrom-principal); font-size:10px; font-weight:700; cursor:pointer; }.foto-produto input { display:none; }.produto-catalogo-info { position:relative; z-index:1; flex:1; min-height:112px; padding:17px 18px 20px; background:white; }.produto-catalogo-info span { color:var(--dourado); font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase; }.produto-catalogo-info h3 { margin:5px 0 10px; color:var(--marrom-escuro); font-size:16px; overflow-wrap:anywhere; }.produto-catalogo-info strong { color:var(--marrom-principal); font-size:20px; }.catalogo-vazio { grid-column:1/-1; padding:60px; background:white; border-radius:18px; color:var(--texto-secundario); text-align:center; }
@media (max-width:800px) { .catalogo-controles { align-items:stretch; flex-direction:column; }.catalogo-grade { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:550px) { .catalogo-grade { grid-template-columns:1fr; } .catalogo-acoes { flex-direction:column; } }
@media print { @page { margin:12mm; size:A4; } body { background:#f6f1ea!important; } body * { visibility:hidden; } #conteudo, #conteudo * { visibility:visible; } #conteudo { position:absolute; left:0; top:0; width:100%; padding:0; } .catalogo-controles { display:block; margin-bottom:20px; padding:22px; } .catalogo-acoes { display:none; } .catalogo-grade { grid-template-columns:repeat(3,1fr); gap:12px; } .produto-catalogo { break-inside:avoid; box-shadow:none; } .foto-produto label { display:none; } }

@media print {
    .catalogo-controles {
        min-height: 78px;
        padding: 18px 150px 18px 4px;
        background: #fffaf5 !important;
        border: 0;
        border-bottom: 2px solid #c6a064;
        border-radius: 0;
        box-shadow: none;
        color: #5f3f2e !important;
    }
    .catalogo-controles::after {
        top: 5px;
        right: 8px;
        width: 100px;
        height: 88px;
    }
    .catalogo-controles h2 { color: #5f3f2e !important; font-size: 25px; letter-spacing: -.3px; }
    .catalogo-controles p { color: #8b7d72 !important; }
    .catalogo-secao-cabecalho h2 { color: #5f3f2e; }
    .catalogo-secao-cabecalho p { color: #8b7d72; }
    .produto-catalogo { background: #fffdfb; }

    .catalogo-controles {
        position: relative;
        min-height: 74px;
        padding: 24px 170px 22px 28px;
        background: linear-gradient(135deg, #5f3f2e, #7b5138) !important;
        border-radius: 14px;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .catalogo-controles::after {
        content: "";
        position: absolute;
        top: 16px;
        right: 24px;
        width: 118px;
        height: 86px;
        background: url('../logo-formare.svg') center / contain no-repeat;
    }
    .catalogo-controles h2 { color: #fff !important; font-size: 23px; }
    .catalogo-controles p { color: rgba(255,255,255,.8) !important; }
    .catalogo-pagina { margin-bottom: 28px; }
    .catalogo-secao-cabecalho { margin: 18px 0 12px; }
    .catalogo-secao-cabecalho h2 { font-size: 22px; }
    .catalogo-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .produto-catalogo { min-height: 390px; border-radius: 14px; border-color: #e5d8cc; }
    .foto-produto { flex-basis: 245px; height: 245px; }
    .produto-catalogo-info { min-height: 125px; padding: 15px 17px 18px; }
    .produto-catalogo-info h3 { font-size: 15px; }
    .produto-catalogo-info strong { font-size: 19px; }
}
.dashboard-card { position:relative; min-height:150px; padding:22px; }
.dashboard-card h3 { margin-bottom:10px; color:var(--texto-secundario); font-size:14px; font-weight:500; }
.dashboard-card h1 { color:var(--marrom-escuro); font-size:26px; }
.dashboard-card small { color:var(--texto-secundario); font-size:11px; }
.alerta-card { background:linear-gradient(145deg,#fff,#fff8f5); border-color:rgba(157,77,77,.25); }
.alerta-card h1,.alerta-texto { color:var(--vermelho-erro)!important; }
.dashboard-paineis { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.dashboard-painel { background:var(--branco); border:1px solid rgba(123,81,56,.1); border-radius:18px; box-shadow:var(--sombra-suave); overflow:hidden; }
.dashboard-painel-cabecalho { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:22px; border-bottom:1px solid var(--bege-claro); }
.dashboard-painel-cabecalho>div { display:flex; gap:12px; }
.dashboard-painel h2 { color:var(--marrom-escuro); font-size:16px; }
.dashboard-painel p { margin-top:3px; color:var(--texto-secundario); font-size:11px; }
.painel-icone { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; font-weight:700; }
.painel-icone-alerta { background:#fae9e5; color:var(--vermelho-erro); }.painel-icone-pedido { background:var(--bege-claro); color:var(--marrom-principal); }
.dashboard-link { border:0; background:none; color:var(--marrom-principal); font-size:11px; font-weight:700; cursor:pointer; white-space:nowrap; }
.dashboard-lista { padding:8px 22px; }
.dashboard-item { display:flex; align-items:center; gap:11px; padding:13px 0; border-bottom:1px solid #f1ebe5; }
.dashboard-item:last-child { border-bottom:0; }.dashboard-avatar { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--bege-claro); color:var(--marrom-principal); font-weight:700; }
.dashboard-item-info { display:flex; flex:1; flex-direction:column; min-width:0; }.dashboard-item-info strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }.dashboard-item-info small { color:var(--texto-secundario); font-size:10px; }.dashboard-valor { color:var(--marrom-escuro); font-size:13px; white-space:nowrap; }
.dashboard-pagamento { display:flex; align-items:flex-end; flex-direction:column; gap:5px; }
.dashboard-botao-pago { border:0; border-radius:7px; padding:6px 9px; background:rgba(82,115,93,.13); color:var(--verde-sucesso); font-size:10px; font-weight:700; cursor:pointer; white-space:nowrap; transition:.2s; }
.dashboard-botao-pago:hover { background:var(--verde-sucesso); color:white; }
.dashboard-botao-feito { border:0; border-radius:7px; padding:6px 12px; background:var(--bege-claro); color:var(--marrom-principal); font-size:10px; font-weight:700; cursor:pointer; white-space:nowrap; transition:.2s; }
.dashboard-botao-feito:hover { background:var(--dourado); color:white; }
.pedido-status-dot { width:9px; height:9px; margin:0 13px; border-radius:50%; background:var(--dourado); }.pedido-status-dot.em-producao { background:var(--verde-sucesso); }
.dashboard-vazio { padding:25px 0; color:var(--texto-secundario); text-align:center; font-size:12px; }.dashboard-painel-rodape { padding:13px 22px; background:#fbf8f4; color:var(--texto-secundario); font-size:11px; }.dashboard-painel-rodape strong { color:var(--marrom-principal); font-size:16px; margin-right:4px; }
@media (max-width:1000px) { .dashboard-resumo,.dashboard-paineis { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:650px) { .dashboard-resumo,.dashboard-paineis { grid-template-columns:1fr; } .dashboard-painel-cabecalho { flex-direction:column; } .dashboard-item { align-items:flex-start; flex-wrap:wrap; } .dashboard-pagamento { width:100%; align-items:flex-end; } }
.resultado-cabecalho {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin: -28px -28px 30px;
    padding: 30px;
    background: linear-gradient(135deg, var(--marrom-escuro), #3f2b22);
    color: var(--branco);
}
.resultado-etiqueta {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--dourado-claro);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.resultado-cabecalho h2 {
    margin-bottom: 6px;
    color: var(--branco);
    font-size: 26px;
}
.resultado-cabecalho p {
    color: rgba(255, 255, 255, 0.72);
    font-size: 14px;
}
.resultado-total {
    min-width: 230px;
    padding: 18px 22px;
    border: 1px solid rgba(223, 196, 151, 0.32);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.08);
    text-align: right;
}
.resultado-total span,
.resultado-total small {
    display: block;
    color: rgba(255, 255, 255, 0.68);
    font-size: 12px;
}
.resultado-total strong {
    display: block;
    margin: 3px 0;
    color: var(--dourado-claro);
    font-size: 30px;
}
.resultado-secao-titulo {
    margin-bottom: 16px;
}
.resultado-secao-titulo > div {
    display: flex;
    align-items: center;
    gap: 12px;
}
.resultado-secao-titulo > div > span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 50%;
    background: var(--bege-claro);
    color: var(--marrom-principal);
    font-size: 11px;
    font-weight: 700;
}
.resultado-secao-titulo h3 {
    color: var(--marrom-escuro);
    font-size: 17px;
}
.resultado-secao-titulo p {
    color: var(--texto-secundario);
    font-size: 12px;
}
.cards-resultado {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.resultado-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--bege-medio);
    border-radius: 14px;
    background: #fffdfb;
}
.resultado-card-icone {
    margin-bottom: 14px;
    font-size: 21px;
}
.resultado-card small {
    color: var(--texto-secundario);
    font-size: 12px;
}
.resultado-card strong {
    margin: 3px 0;
    color: var(--marrom-escuro);
    font-size: 23px;
}
.resultado-card p {
    color: var(--texto-secundario);
    font-size: 11px;
}
.resultado-card.destaque {
    border-color: rgba(198, 160, 100, 0.5);
    background: var(--bege-fundo);
}
.resultado-card.destaque strong {
    color: var(--marrom-principal);
}
.materiais-titulo {
    margin-top: 28px;
}
.resumo-producao {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.material-producao {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px;
    border-radius: 12px;
    background: var(--bege-fundo);
}
.material-icone {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 10px;
    background: var(--branco);
    font-size: 18px;
}
.material-producao small,
.material-producao strong {
    display: block;
}
.material-producao small {
    color: var(--texto-secundario);
    font-size: 11px;
}
.material-producao strong {
    color: var(--marrom-escuro);
    font-size: 17px;
}
.resultado-observacao {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    padding: 12px 15px;
    border-radius: 10px;
    background: rgba(82, 115, 93, 0.1);
    color: var(--verde-sucesso);
    font-size: 12px;
}
.resultado-observacao > span {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    background: var(--verde-sucesso);
    color: var(--branco);
    font-weight: 700;
}

@media (max-width: 1000px) {
    .cards-resultado,
    .resumo-producao {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 650px) {
    .resultado-calculadora {
        padding: 20px;
    }
    .resultado-cabecalho {
        align-items: stretch;
        flex-direction: column;
        margin: -20px -20px 24px;
        padding: 22px;
    }
    .resultado-total {
        min-width: 0;
        text-align: left;
    }
    .cards-resultado,
    .resumo-producao {
        grid-template-columns: 1fr;
    }
}

/* Layout simples do resultado da calculadora */
.resultado-calculadora {
    overflow: visible;
    padding: 30px;
}
.resultado-titulo {
    margin-bottom: 30px;
}
.resultado-titulo h2 {
    margin-bottom: 5px;
    color: var(--marrom-escuro);
    font-size: 24px;
}
.resultado-titulo p {
    color: var(--texto-secundario);
}
.titulo-grupo-resultado {
    margin: 0 0 14px;
    color: var(--marrom-escuro);
    font-size: 16px;
}
.cards-resultado.resultado-individual {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 32px;
}
.cards-resultado.resultado-totais {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 32px;
}
.resultado-card {
    padding: 22px;
    background: #f7f7f7;
    border: 0;
    border-radius: 15px;
}
.resultado-card > span {
    margin-bottom: 8px;
    color: var(--texto-secundario);
    font-size: 14px;
}
.resultado-card > strong {
    margin-bottom: 5px;
    color: #181818;
    font-size: 26px;
}
.resultado-card > small {
    color: var(--texto-secundario);
}
.resultado-card.destaque {
    border: 0;
    background: var(--marrom-escuro);
}
.resultado-card.destaque > span,
.resultado-card.destaque > small {
    color: rgba(255, 255, 255, 0.7);
}
.resultado-card.destaque > strong {
    color: var(--dourado-claro);
}
.resumo-producao {
    display: block;
    margin-top: 0;
    padding: 25px;
    background: #faf8f0;
    border-left: 5px solid var(--dourado);
    border-radius: 12px;
}
.resumo-producao h3 {
    margin-bottom: 10px;
}
.resumo-producao p {
    margin-bottom: 15px;
}
.resumo-producao ul {
    padding-left: 22px;
}
.resumo-producao li {
    margin-bottom: 8px;
}
@media (max-width: 900px) {
    .cards-resultado.resultado-totais {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 650px) {
    .resultado-calculadora {
        padding: 20px;
    }
    .cards-resultado.resultado-individual {
        grid-template-columns: 1fr;
    }
}
/* Identidade Formare */

.logo-sistema {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 25px 15px;
    margin-bottom: 20px;

    text-align: center;
    border-bottom: 1px solid rgba(198, 160, 100, 0.30);
}
.imagem-logo {
    width: 150px;
    max-width: 90%;
    height: auto;
    margin-bottom: 12px;
}
.identificacao-sistema {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.identificacao-sistema strong {
    color: var(--dourado-claro);
    font-size: 17px;
    letter-spacing: 2px;
}
.identificacao-sistema span {
    color: rgba(255, 255, 255, 0.70);
    font-size: 12px;
    letter-spacing: 0.5px;
}

/* Logo completa no canto superior esquerdo, integrada ao fundo da mesa. */
.menu {
    background: #efe7dd;
    color: var(--marrom-principal);
}

.logo-sistema {
    align-items: flex-start;
    padding: 18px 0 22px;
    border-bottom-color: rgba(118, 75, 54, 0.18);
    cursor: pointer;
}

.imagem-logo {
    display: block;
    width: 200px;
    max-width: 100%;
    margin: 0;
}

.identificacao-sistema {
    display: none;
}

.menu button {
    background: rgba(118, 75, 54, 0.08);
    color: var(--marrom-principal);
}

.menu button:hover {
    background: var(--marrom-principal);
    color: var(--branco);
}
.conteudo-principal {
    min-height: 100vh;
    margin-left: 260px;
    padding: 30px;
    background: var(--bege-fundo);
}
.topo-pagina {
    margin-bottom: 25px;
}
.topo-pagina h1,
#tituloPagina {
    color: var(--marrom-escuro);
    margin-bottom: 5px;
}
.topo-pagina p,
#subtituloPagina {
    color: var(--texto-secundario);
}
/* ======================================================
   MÓDULO CLIENTES
====================================================== */

.resumo-clientes {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.card-resumo-cliente {
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.1);
    border-radius: 16px;
    padding: 22px;
    box-shadow: var(--sombra-suave);
    display: flex;
    flex-direction: column;
}

.card-resumo-cliente span {
    color: var(--texto-secundario);
    font-size: 14px;
    margin-bottom: 8px;
}

.card-resumo-cliente strong {
    color: var(--marrom-escuro);
    font-size: 30px;
    line-height: 1;
    margin-bottom: 8px;
}

.card-resumo-cliente small {
    color: var(--texto-secundario);
    font-size: 12px;
}

.formulario-clientes {
    margin-bottom: 24px;
}

.titulo-secao {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 22px;
}

.titulo-secao h2 {
    margin: 0 0 5px;
}

.titulo-secao p {
    color: var(--texto-secundario);
    margin: 0;
}

.grade-formulario-clientes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.campo-grande {
    grid-column: span 2;
}

.campo-linha-inteira {
    grid-column: 1 / -1;
}

.acoes-formulario {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
}

.lista-clientes-card {
    overflow: hidden;
}

.cabecalho-listagem {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 20px;
}

.cabecalho-listagem h2 {
    margin: 0 0 5px;
}

.cabecalho-listagem p {
    color: var(--texto-secundario);
    margin: 0;
}

.pesquisa-clientes {
    width: min(100%, 340px);
}

.pesquisa-clientes input {
    width: 100%;
    background: #fffdfb;
    border: 1px solid var(--bege-medio);
    border-radius: 10px;
    padding: 12px 14px;
    outline: none;
}

.pesquisa-clientes input:focus {
    border-color: var(--dourado);
    box-shadow: 0 0 0 3px rgba(198, 160, 100, 0.15);
}

.tabela-responsiva {
    width: 100%;
    overflow-x: auto;
}

.tabela-clientes {
    min-width: 850px;
}

.cliente-identificacao,
.cliente-contato {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cliente-identificacao strong {
    color: var(--marrom-escuro);
}

.cliente-identificacao small,
.cliente-contato small {
    color: var(--texto-secundario);
}

.status-cliente {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 999px;
    padding: 6px 11px;
    font-size: 12px;
    font-weight: 700;
}

.botao-status-cliente {
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.botao-status-cliente:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 7px rgba(70, 45, 30, 0.14);
}

.status-ativo {
    background: rgba(82, 115, 93, 0.13);
    color: var(--verde-sucesso);
}

.status-inativo {
    background: rgba(157, 77, 77, 0.12);
    color: var(--vermelho-erro);
}

.acoes-tabela {
    display: flex;
    align-items: center;
    gap: 7px;
}

.acoes-tabela form {
    display: flex;
    margin: 0;
}

.botao-tabela,
.tabela button.botao-tabela {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    line-height: 1;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: 700;
    transition: background-color 0.2s, color 0.2s;
}

.botao-tabela.editar,
a.botao-tabela.editar {
    font-size: 0;
    color: transparent;
    background-color: var(--bege-claro);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M11.5 2.3l2.2 2.2-8.4 8.4H3.1v-2.2l8.4-8.4z' stroke='%237b5138' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px 15px;
}

.botao-tabela.editar:hover,
a.botao-tabela.editar:hover {
    background-color: var(--marrom-principal);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M11.5 2.3l2.2 2.2-8.4 8.4H3.1v-2.2l8.4-8.4z' stroke='%23ffffff' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
}

tr.linha-em-edicao td {
    background: #fbf5e9;
}

.botao-tabela.excluir,
.tabela button.botao-tabela.excluir {
    font-size: 0;
    color: transparent;
    background-color: #f0d0d0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.3 3.3l9.4 9.4M12.7 3.3l-9.4 9.4' stroke='%238b2e2e' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 14px;
}

.botao-tabela.excluir:hover,
.tabela button.botao-tabela.excluir:hover {
    background-color: #8b2e2e;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.3 3.3l9.4 9.4M12.7 3.3l-9.4 9.4' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.estado-vazio {
    padding: 50px 20px;
    text-align: center;
    background: #fffdfb;
    border: 1px dashed var(--bege-medio);
    border-radius: 14px;
}

.estado-vazio span {
    display: block;
    font-size: 36px;
    margin-bottom: 10px;
}

.estado-vazio h3 {
    color: var(--marrom-escuro);
    margin: 0 0 7px;
}

.estado-vazio p {
    color: var(--texto-secundario);
    margin: 0;
}

@media (max-width: 1100px) {
    .resumo-clientes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-formulario-clientes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .campo-grande {
        grid-column: span 2;
    }
}

@media (max-width: 700px) {
    .resumo-clientes {
        grid-template-columns: 1fr;
    }

    .grade-formulario-clientes {
        grid-template-columns: 1fr;
    }

    .campo-grande,
    .campo-linha-inteira {
        grid-column: 1;
    }

    .cabecalho-listagem {
        align-items: stretch;
        flex-direction: column;
    }

    .pesquisa-clientes {
        width: 100%;
    }

    .acoes-formulario {
        align-items: stretch;
        flex-direction: column;
    }

    .acoes-formulario button {
        width: 100%;
    }
}
/* ======================================================
   MÓDULO VENDAS
====================================================== */

.resumo-vendas {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.card-resumo-venda {
    display: flex;
    flex-direction: column;
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.1);
    border-radius: 16px;
    padding: 22px;
    box-shadow: var(--sombra-suave);
}

.card-resumo-venda span {
    color: var(--texto-secundario);
    font-size: 14px;
    margin-bottom: 8px;
}

.card-resumo-venda strong {
    color: var(--marrom-escuro);
    font-size: 25px;
    margin-bottom: 7px;
}

.card-resumo-venda small {
    color: var(--texto-secundario);
    font-size: 12px;
}

.formulario-vendas {
    margin-bottom: 24px;
}

.grade-formulario-vendas {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.area-adicionar-produto {
    background: #faf6f0;
    border: 1px solid var(--bege-medio);
    border-radius: 14px;
    padding: 20px;
    margin: 24px 0;
}

.area-adicionar-produto h3 {
    color: var(--marrom-escuro);
    margin: 0 0 18px;
}

.grade-adicionar-produto {
    display: grid;
    grid-template-columns: 2fr 0.7fr 1fr auto;
    align-items: end;
    gap: 14px;
}

.botao-adicionar-item {
    min-height: 43px;
    white-space: nowrap;
}

.itens-venda {
    margin-top: 20px;
}

.tabela-itens-venda {
    min-width: 650px;
}

.campo-quantidade-item {
    width: 75px;
    border: 1px solid var(--bege-medio);
    border-radius: 7px;
    padding: 8px;
}

.estado-vazio-venda {
    color: var(--texto-secundario);
    text-align: center;
    border: 1px dashed var(--bege-medio);
    border-radius: 10px;
    padding: 25px;
}

.totais-venda-formulario {
    margin-top: 20px;
}

.resumo-total-venda {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: var(--marrom-escuro);
    border-radius: 14px;
    margin-top: 24px;
    overflow: hidden;
}

.resumo-total-venda > div {
    display: flex;
    flex-direction: column;
    padding: 20px;
    border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.resumo-total-venda > div:last-child {
    border-right: none;
}

.resumo-total-venda span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 13px;
    margin-bottom: 7px;
}

.resumo-total-venda strong {
    color: white;
    font-size: 21px;
}

.resumo-total-venda .total-final-venda {
    background: var(--dourado);
}

.resumo-total-venda .total-final-venda span {
    color: var(--marrom-escuro);
}

.resumo-total-venda .total-final-venda strong {
    color: var(--marrom-escuro);
    font-size: 25px;
}

.filtros-vendas {
    display: flex;
    gap: 10px;
}

.filtros-vendas input,
.filtros-vendas select {
    background: #fffdfb;
    border: 1px solid var(--bege-medio);
    border-radius: 10px;
    padding: 11px 13px;
    outline: none;
}

.filtros-vendas input {
    min-width: 250px;
}

.tabela-vendas {
    min-width: 1050px;
}

.data-venda-tabela {
    display: block;
    color: var(--texto-secundario);
    margin-top: 4px;
}

.status-venda {
    display: inline-flex;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.venda-paga,
.venda-concluida {
    background: rgba(82, 115, 93, 0.13);
    color: var(--verde-sucesso);
}

.venda-pendente,
.venda-andamento {
    background: rgba(198, 160, 100, 0.18);
    color: #8a6428;
}

.venda-parcelada {
    background: rgba(72, 103, 149, 0.13);
    color: #486795;
}

.venda-cancelada {
    background: rgba(157, 77, 77, 0.12);
    color: var(--vermelho-erro);
}

@media (max-width: 1100px) {
    .resumo-vendas {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-formulario-vendas {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-adicionar-produto {
        grid-template-columns: 1fr 1fr;
    }

    .campo-produto-venda {
        grid-column: 1 / -1;
    }

    .resumo-total-venda {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .resumo-vendas,
    .grade-formulario-vendas,
    .grade-adicionar-produto,
    .resumo-total-venda {
        grid-template-columns: 1fr;
    }

    .campo-grande,
    .campo-produto-venda,
    .campo-linha-inteira {
        grid-column: 1;
    }

    .filtros-vendas {
        width: 100%;
        flex-direction: column;
    }

    .filtros-vendas input {
        min-width: 0;
        width: 100%;
    }

    .filtros-vendas select {
        width: 100%;
    }

    .resumo-total-venda > div {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }
}
/* ======================================================
   MÓDULO PEDIDOS
====================================================== */

.resumo-pedidos {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.card-resumo-pedido {
    display: flex;
    flex-direction: column;
    background: var(--branco);
    border: 1px solid rgba(123, 81, 56, 0.1);
    border-radius: 16px;
    padding: 22px;
    box-shadow: var(--sombra-suave);
}

.card-resumo-pedido span {
    color: var(--texto-secundario);
    font-size: 14px;
    margin-bottom: 8px;
}

.card-resumo-pedido strong {
    color: var(--marrom-escuro);
    font-size: 25px;
    margin-bottom: 7px;
}

.card-resumo-pedido small {
    color: var(--texto-secundario);
    font-size: 12px;
}

.formulario-pedidos {
    margin-bottom: 24px;
}

.botao-novo-cliente-pedido {
    align-self: flex-start;
    margin-top: 8px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--marrom-principal);
    font-weight: 700;
    cursor: pointer;
}

.cadastro-cliente-pedido {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid var(--bege-medio);
    border-radius: 14px;
    background: #faf6f0;
}

.cadastro-cliente-pedido[hidden] {
    display: none;
}

.cadastro-cliente-pedido-cabecalho {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.cadastro-cliente-pedido-cabecalho h3,
.cadastro-cliente-pedido-cabecalho p {
    margin: 0;
}

.cadastro-cliente-pedido-cabecalho p {
    margin-top: 4px;
    color: var(--texto-secundario);
}

.botao-fechar-cliente-pedido {
    border: none;
    background: transparent;
    color: var(--texto-secundario);
    font-size: 24px;
    cursor: pointer;
}

.grade-cadastro-cliente-pedido {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.numero-pedido-preview {
    background: var(--bege-claro);
    color: var(--marrom-principal);
    border: 1px solid var(--bege-medio);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 700;
}

.grade-formulario-pedidos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.area-adicionar-produto-pedido {
    background: #faf6f0;
    border: 1px solid var(--bege-medio);
    border-radius: 14px;
    padding: 20px;
    margin: 24px 0;
}

.area-adicionar-produto-pedido h3 {
    color: var(--marrom-escuro);
    margin: 0 0 18px;
}

.grade-adicionar-produto-pedido {
    display: grid;
    grid-template-columns: 2fr 0.7fr 1fr auto;
    align-items: end;
    gap: 14px;
}

.itens-pedido {
    margin-top: 20px;
}

.tabela-itens-pedido {
    min-width: 670px;
}

.campo-valor-item-pedido {
    width: 110px;
    border: 1px solid var(--bege-medio);
    border-radius: 7px;
    padding: 8px;
}

.estado-vazio-pedido {
    color: var(--texto-secundario);
    text-align: center;
    border: 1px dashed var(--bege-medio);
    border-radius: 10px;
    padding: 25px;
}

.resumo-total-pedido {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    background: var(--marrom-escuro);
    border-radius: 14px;
    margin-top: 24px;
    overflow: hidden;
}

.resumo-total-pedido > div {
    display: flex;
    flex-direction: column;
    padding: 18px;
    border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.resumo-total-pedido > div:last-child {
    border-right: none;
}

.resumo-total-pedido span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    margin-bottom: 7px;
}

.resumo-total-pedido strong {
    color: white;
    font-size: 18px;
}

.resumo-total-pedido .total-final-pedido {
    background: var(--dourado);
}

.resumo-total-pedido .total-final-pedido span,
.resumo-total-pedido .total-final-pedido strong {
    color: var(--marrom-escuro);
}

.filtros-pedidos {
    display: flex;
    gap: 10px;
}

.filtros-pedidos input,
.filtros-pedidos select {
    background: #fffdfb;
    border: 1px solid var(--bege-medio);
    border-radius: 10px;
    padding: 11px 13px;
    outline: none;
}

.filtros-pedidos input {
    min-width: 250px;
}

.tabela-pedidos {
    min-width: 1100px;
}

.data-pedido-tabela,
.saldo-pedido {
    display: block;
    color: var(--texto-secundario);
    margin-top: 4px;
    font-size: 11px;
}

.status-pedido {
    display: inline-flex;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.pedido-novo {
    background: rgba(72, 103, 149, 0.13);
    color: #486795;
}

.pedido-producao,
.pedido-parcial {
    background: rgba(198, 160, 100, 0.18);
    color: #8a6428;
}

.pedido-pronto {
    background: rgba(126, 92, 150, 0.13);
    color: #76518e;
}

.pedido-entregue,
.pedido-pago {
    background: rgba(82, 115, 93, 0.13);
    color: var(--verde-sucesso);
}

.pedido-cancelado {
    background: rgba(157, 77, 77, 0.12);
    color: var(--vermelho-erro);
}

.pedido-pendente {
    background: rgba(157, 77, 77, 0.1);
    color: var(--vermelho-erro);
}

.botao-pedido {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.2s;
}

.botao-pedido.vender {
    background: rgba(82, 115, 93, 0.13);
}

.botao-pedido.convertido {
    background: var(--bege-claro);
    cursor: default;
}

.botao-pedido.vender:hover {
    transform: translateY(-1px);
}

.botao-pedido.orcamento {
    background: rgba(198, 160, 100, 0.18);
}

.botao-pedido.orcamento:hover {
    transform: translateY(-1px);
}

@media (max-width: 1200px) {
    .resumo-total-pedido {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1100px) {
    .resumo-pedidos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-formulario-pedidos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-cadastro-cliente-pedido {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grade-adicionar-produto-pedido {
        grid-template-columns: 1fr 1fr;
    }

    .campo-produto-pedido {
        grid-column: 1 / -1;
    }
}

@media (max-width: 700px) {
    .resumo-pedidos,
    .grade-formulario-pedidos,
    .grade-cadastro-cliente-pedido,
    .grade-adicionar-produto-pedido,
    .resumo-total-pedido {
        grid-template-columns: 1fr;
    }

    .campo-grande,
    .campo-produto-pedido,
    .campo-linha-inteira {
        grid-column: 1;
    }

    .titulo-secao {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .filtros-pedidos {
        width: 100%;
        flex-direction: column;
    }

    .filtros-pedidos input,
    .filtros-pedidos select {
        width: 100%;
        min-width: 0;
    }
}

#custosFixosProduto,
#perdasProduto,
#taxasProduto {
    display: none;
}

#custosFixosProduto,
#perdasProduto,
#taxasProduto {
    /* Os campos antigos continuam compatíveis com cadastros anteriores,
       mas não aparecem mais no novo formulário. */
}

#custosFixosProduto,
#perdasProduto,
#taxasProduto {
    visibility: hidden;
}

#custosFixosProduto,
#perdasProduto,
#taxasProduto {
    pointer-events: none;
}

.campo:has(#custosFixosProduto),
.campo:has(#perdasProduto),
.campo:has(#taxasProduto) {
    display: none;
}

#insumosProduto {
    display: grid;
    gap: 8px;
    padding: 10px;
    background: #fffaf5;
    border: 1px solid var(--bege-medio);
    border-radius: 10px;
}

.linha-insumo-produto {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 105px 30px;
    gap: 7px;
    align-items: center;
}

.linha-insumo-produto select,
.linha-insumo-produto input {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid var(--bege-medio);
    border-radius: 7px;
    background: white;
    font-size: 12px;
}

.linha-insumo-produto button {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 7px;
    background: #f2e1d8;
    color: var(--marrom-principal);
    cursor: pointer;
}

#clienteNome {
    text-transform: uppercase;
}

@media print {
    .catalogo-controles { min-height:78px; padding:18px 150px 18px 4px; background:#fffaf5 !important; border:0; border-bottom:2px solid #c6a064; border-radius:0; box-shadow:none; color:#5f3f2e !important; }
    .catalogo-controles::after { top:5px; right:8px; width:100px; height:88px; }
    .catalogo-controles h2 { color:#5f3f2e !important; font-size:25px; letter-spacing:-.3px; }
    .catalogo-controles p { color:#8b7d72 !important; }
    .catalogo-secao-cabecalho h2 { color:#5f3f2e; }
    .catalogo-secao-cabecalho p { color:#8b7d72; }
    .produto-catalogo { background:#fffdfb; }
}