/* Copiado de produtos_2.php */
/* Corrige na raiz um bug que já apareceu 2x: box-sizing e font-family só
   valiam dentro de .bgp-wrap, então qualquer página ou modal fora dela (login,
   cadastro, minha-conta, os modais do catálogo) renderizava com a fonte serifada
   padrão do navegador e campos vazando de largura. Aplicando global, cobre tudo
   de uma vez, inclusive páginas que ainda vamos criar no futuro. */
*, *::before, *::after { box-sizing: border-box; }
html, body { font-family: 'Inter', -apple-system, sans-serif; }

.bgp-wrap { font-family: 'Inter', sans-serif; margin: 25px auto; max-width: 1500px; padding: 0 20px; color: #1e293b; background: #f8fafc; } 
.bgp-wrap * { box-sizing: border-box; }
.bgp-page-header { margin-bottom: 25px; }
.bgp-page-title { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 26px; font-weight: 900; color: #0f172a; letter-spacing: -0.75px; }
.bgp-card { background: #ffffff; padding: 25px; border-radius: 16px; box-shadow: 0 4px 25px rgba(15, 23, 42, 0.03); border: 1px solid #e2e8f0; }

    /* DESIGN REVOLUCIONÁRIO E ULTRA-PROFISSIONAL */
    .bgp-wrap { font-family: 'Inter', sans-serif; margin: 25px auto; max-width: 1500px; padding: 0 20px; color: #1e293b; background: #f8fafc; } 
    .bgp-wrap * { box-sizing: border-box; }
    
    .bgp-page-header { margin-bottom: 25px; }
    .bgp-page-title { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 26px; font-weight: 900; color: #0f172a; letter-spacing: -0.75px; }
    
    .bgp-toast-alert { padding: 16px 20px; border-radius: 12px; margin-bottom: 25px; font-size: 14px; font-weight: 600; display: flex; align-items: center; box-shadow: 0 4px 12px rgba(0,0,0,0.02); }
    .bgp-toast-success { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; } 
    .bgp-toast-error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
    
    /* DASHBOARD DE ESTOQUE - CSS */
    .bgp-stats-dashboard { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-bottom: 25px; }
    .bgp-stat-box { background: #ffffff; border: 1px solid #e2e8f0; padding: 18px 20px; border-radius: 16px; display: flex; align-items: center; gap: 18px; transition: transform 0.2s, box-shadow 0.2s; box-shadow: 0 4px 25px rgba(15, 23, 42, 0.02); }
    .bgp-stat-box:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(15, 23, 42, 0.05); }
    .bgp-stat-icon { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .bgp-stat-icon .dashicons { font-size: 26px; width: 26px; height: 26px; }
    .bgp-stat-info { display: flex; flex-direction: column; }
    .bgp-stat-label { font-size: 11px; font-weight: 800; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
    .bgp-stat-value { font-size: 22px; font-weight: 900; color: #0f172a; line-height: 1; letter-spacing: -0.5px; }

    @media (max-width: 1024px) { .bgp-stats-dashboard { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 600px) { .bgp-stats-dashboard { grid-template-columns: 1fr; } }

    .bgp-forms-grid { display: grid; grid-template-columns: 1fr 2.2fr; gap: 25px; margin-bottom: 30px; align-items: start; }
    .bgp-card { background: #ffffff; padding: 25px; border-radius: 16px; box-shadow: 0 4px 25px rgba(15, 23, 42, 0.03); border: 1px solid #e2e8f0; transition: border-color 0.2s; }
    .bgp-card:hover { border-color: #cbd5e1; }
    .bgp-card-blue { background: #f0f6ff; border-color: #bae6fd; }
    .bgp-card-title { font-size: 18px; font-weight: 800; color: #0f172a; margin-top: 0; margin-bottom: 18px; display: flex; align-items: center; gap: 8px; letter-spacing: -0.3px; }
    
    .bgp-input-group { margin-bottom: 18px; } 
    .bgp-input-group label { display: block; font-size: 11px; font-weight: 800; color: #475569; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
    
    .bgp-input-group input[type="text"], 
    .bgp-input-group input[type="number"], 
    .bgp-input-group input[type="date"], 
    .bgp-input-group input[type="email"], 
    .bgp-input-group input[type="password"], 
    .bgp-input-group input[type="tel"], 
    .bgp-input-group input[type="search"], 
    .bgp-input-group select,
    .bgp-input-group textarea { 
        width: 100%; padding: 11px 14px; border: 2px solid #e2e8f0; border-radius: 10px; font-size: 14px; font-weight: 600; color: #0f172a; background: #ffffff; transition: all 0.2s; outline: none; box-shadow: none;
    }
    .bgp-input-group select { cursor: pointer; appearance: auto; }
    .bgp-input-group input:focus, .bgp-input-group select:focus, .bgp-input-group textarea:focus { border-color: #2563eb; background: #ffffff; box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1); }
    
    .bgp-form-row-2 { display: grid; grid-template-columns: 1fr 2fr; gap: 16px; } 
    .bgp-form-row-5 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
    
    .bgp-btn-primary { background: #2563eb; color: #ffffff; padding: 12px 24px; border: none; border-radius: 10px; font-weight: 700; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 0.2s; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2); }
    .bgp-btn-primary:hover { background: #1d4ed8; transform: translateY(-1px); box-shadow: 0 6px 15px rgba(37, 99, 235, 0.3); }
    .bgp-btn-primary:active { transform: translateY(0); }
    
    .bgp-btn-secondary { background: #f1f5f9; color: #334155; padding: 12px 20px; border: 1px solid #e2e8f0; border-radius: 10px; font-weight: 700; cursor: pointer; transition: all 0.2s; }
    .bgp-btn-secondary:hover { background: #e2e8f0; color: #0f172a; }
    
    .bgp-badge { padding: 4px 8px; border-radius: 6px; font-weight: 800; font-size: 10px; text-transform: uppercase; display: inline-flex; align-items: center; }
    .bg-green { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; } 
    .bg-red { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; } 
    .bg-blue { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; } 
    .bg-gray { background: #f8fafc; color: #475569; border: 1px solid #e2e8f0; }
    
    /* AÇÕES DA TABELA BLINDADAS */
    .bgp-btn-action { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; cursor: pointer; border: none; transition: all 0.2s; padding: 0; flex-shrink: 0; }
    .bgp-btn-action .dashicons { font-size: 17px; width: 17px; height: 17px; display: flex; align-items: center; justify-content: center; }
    .bgp-btn-action:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0,0,0,0.08); filter: brightness(0.95); }
    
    .bgp-chevron { transition: transform 0.2s; font-size:16px; width:16px; height:16px; color:#94a3b8; } 
    .bgp-row-table.open .bgp-chevron { transform: rotate(90deg); color:#ea580c; }

    /* CORE DA TABELA DE PRODUTOS WP_LIST_TABLE */
    .tablenav { height: auto; padding: 10px 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 15px; }
    .tablenav .displaying-num { font-size: 12px; font-weight: 800; background: #f1f5f9; padding: 6px 12px; border-radius: 8px; color: #475569; border: 1px solid #e2e8f0; }
    
    .search-box { display: flex; gap: 8px; align-items: center; float: none !important; margin-left: auto; }
    .search-box input[type="search"] { padding: 9px 14px; border-radius: 8px; border: 2px solid #e2e8f0; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; background: #ffffff; transition: 0.2s; height: 38px; outline: none; }
    .search-box input[type="search"]:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,0.08); }
    .search-box input[type="submit"] { background: #2563eb; color: #fff; border: none; padding: 0 18px; border-radius: 8px; font-weight: 700; font-size: 13px; cursor: pointer; transition: 0.2s; height: 38px; }
    .search-box input[type="submit"]:hover { background: #1d4ed8; }

    .wp-list-table { background: #ffffff !important; border-radius: 14px !important; overflow: hidden !important; box-shadow: 0 4px 30px rgba(15,23,42,0.02) !important; border: 1px solid #e2e8f0 !important; margin-top: 15px !important; width: 100%; border-collapse: collapse !important;}
    .wp-list-table thead tr { background: #f8fafc; }
    .wp-list-table thead th { padding: 16px 14px !important; color: #475569 !important; font-size: 11px !important; text-transform: uppercase; font-weight: 800 !important; border-bottom: 2px solid #e2e8f0 !important; letter-spacing: 0.5px; }
    .wp-list-table tbody td { border-bottom: 1px solid #f1f5f9 !important; padding: 14px !important; vertical-align: middle !important; color: #1e293b; font-size: 13px; }
    .wp-list-table tbody tr:nth-child(even) { background: #fbfcfd; }
    .wp-list-table tbody tr:hover { background: #f1f5f9 !important; }
    
    .column-cb { width: 45px; text-align: center; }
    .column-cb input[type="checkbox"] { width: 17px; height: 17px; border-radius: 5px; border: 2px solid #cbd5e1; cursor: pointer; }

    .tablenav-pages .pagination-links { display: inline-flex; gap: 4px; align-items: center; }
    .tablenav-pages .pagination-links .button, 
    .tablenav-pages .pagination-links .tablenav-pages-navspan { padding: 6px 12px; background: #ffffff; border: 1px solid #cbd5e1; border-radius: 6px; color: #334155; font-weight: 700; font-size: 13px; text-decoration: none;}
    .tablenav-pages .pagination-links .button:hover { background: #f8fafc; border-color: #94a3b8; }
    .tablenav-pages .pagination-links .current-page { font-weight: 900; background: #2563eb; color: #ffffff; border-color: #2563eb; }
    
    /* GESTOR DE AÇÕES EM MASSA ELEGANTE */
    .bgp-promo-bar { background: #fff7ed; border: 1px solid #ffedd5; border-left: 5px solid #ea580c; padding: 18px 22px; border-radius: 12px; margin-bottom: 25px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
    .bgp-promo-title-area { display: flex; align-items: center; gap: 12px; }
    .bgp-promo-actions { display: flex; gap: 8px; align-items: center; }
    .bgp-promo-actions input { width: 110px; padding: 9px 12px; border: 2px solid #fdba74; border-radius: 8px; font-weight: 700; font-size: 13px; outline: none; }
    .bgp-promo-actions input:focus { border-color: #ea580c; box-shadow: 0 0 0 3px rgba(234,88,12,0.1); }
    .bgp-promo-actions button { padding: 9px 16px; font-size: 13px; font-weight: 700; border-radius: 8px; cursor: pointer; border: 1px solid transparent; transition: all 0.2s; display: inline-flex; align-items: center; gap: 4px; height: 37px; }

    /* VERSÃO MOBILE REORDENADA EM SUPERCARDS */
    @media (max-width: 782px) {
        .bgp-forms-grid, .bgp-form-row-2, .bgp-form-row-5 { grid-template-columns: 1fr; gap: 12px; }
        .bgp-promo-bar { flex-direction: column; align-items: stretch; padding: 15px; gap: 15px; }
        .bgp-promo-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 8px; }
        .bgp-promo-actions input { grid-column: 1 / -1; width: 100%; text-align: center; }
        .bgp-promo-actions button[name="excluir_selecionados"] { grid-column: 1 / -1; }

        .wp-list-table { display: block !important; border: none !important; box-shadow: none !important; background: transparent !important; }
        .wp-list-table thead, .wp-list-table tfoot { display: none !important; }
        .wp-list-table tbody { display: flex !important; flex-direction: column !important; gap: 16px !important; }
        
        .wp-list-table tr.bgp-row-produto { 
            display: flex !important; flex-direction: column !important; background: #ffffff !important; border-radius: 16px !important; padding: 15px !important; box-shadow: 0 4px 15px rgba(0,0,0,0.03) !important; border: 1px solid #e2e8f0 !important; position: relative !important; gap: 0;
        }
        
        .wp-list-table td { 
            display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 10px 0 !important; border-bottom: 1px dashed #e2e8f0 !important; text-align: right !important; width: 100% !important; gap: 15px !important; position: relative !important; 
        }
        .wp-list-table td:last-child { border-bottom: none !important; padding-bottom: 0 !important; }
        .wp-list-table td > div { justify-content: flex-end; text-align: right; width: 100%; display: flex; flex-direction: column; align-items: flex-end; }
        .wp-list-table .toggle-row { display: none !important; }
        
        .wp-list-table td::before { 
            font-size: 11px !important; font-weight: 800 !important; color: #94a3b8 !important; text-transform: uppercase !important; display: block !important; width: auto !important; flex-shrink: 0 !important; text-align: left;
        }
        
        .wp-list-table td.column-cb { order: 1; position: absolute !important; top: 15px !important; left: 15px !important; padding: 0 !important; border: none !important; width: auto !important; z-index: 10; }
        .wp-list-table td.column-nome { order: 2; padding: 0 0 12px 32px !important; border-bottom: 2px solid #f1f5f9 !important; }
        .wp-list-table td.column-nome::before { display: none !important; }
        .wp-list-table td.column-nome > div { justify-content: flex-start !important; align-items: flex-start !important; text-align: left !important; }
        .wp-list-table td.column-nome strong { font-size: 15px !important; color: #0f172a !important; }
        
        .wp-list-table td.column-codigo_barras { order: 3; } .wp-list-table td.column-codigo_barras::before { content: "Código"; }
        .wp-list-table td.column-custo { order: 4; } .wp-list-table td.column-custo::before { content: "Custo/Margem"; }
        .wp-list-table td.column-preco_venda { order: 5; } .wp-list-table td.column-preco_venda::before { content: "Preços"; }
        .wp-list-table td.column-estoque { order: 6; } .wp-list-table td.column-estoque::before { content: "Estoque"; }
        
        .wp-list-table td.column-acoes { order: 7; justify-content: center !important; padding-top: 12px !important; border-top: 1px solid #f1f5f9 !important; }
        .wp-list-table td.column-acoes::before { display: none !important; }
        .wp-list-table td.column-acoes > div { flex-direction: row !important; justify-content: center !important; gap: 8px !important; }
        .wp-list-table td.column-acoes .bgp-btn-action { width: 42px !important; height: 42px !important; } 

        .wp-list-table tr.bgp-row-fiscal { display: block !important; margin-top: -15px !important; padding-top: 10px !important; border: none !important; }
        .wp-list-table tr.bgp-row-fiscal td { display: block !important; border: none !important; padding: 0 !important; }
        .wp-list-table tr.bgp-row-fiscal td > div { margin: 0 !important; border-radius: 0 0 16px 16px !important; border-top: none !important;}
        .wp-list-table tr.bgp-row-fiscal td > div > div { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
    }

    /* MODAL BLINDADO */
    .bgp-modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(15,23,42,0.6); z-index: 9999999; align-items: center; justify-content: center; backdrop-filter: blur(5px); }
    .bgp-modal-content { background: #ffffff; padding: 25px; border-radius: 18px; width: 95%; max-width: 800px; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); max-height: 90vh; overflow-y: auto; position: relative; animation: modalEnter 0.25s ease-out forwards; font-family: 'Inter', -apple-system, sans-serif; box-sizing: border-box; }
    /* Os modais ficam FORA da .bgp-wrap, então não herdam nem o box-sizing:border-box
       nem a fonte Inter que .bgp-wrap * garante pro resto da página — sem isso, todo
       input com width:100% + padding + border fica mais largo que a coluna e vaza. */
    .bgp-modal-content *, .bgp-modal-content *::before, .bgp-modal-content *::after { box-sizing: border-box; }
    .bgp-modal-content label,
    .bgp-modal-content input,
    .bgp-modal-content textarea,
    .bgp-modal-content select,
    .bgp-modal-content button,
    .bgp-modal-content h2,
    .bgp-modal-content h3,
    .bgp-modal-content p,
    .bgp-modal-content strong,
    .bgp-modal-content small,
    .bgp-modal-content a { font-family: 'Inter', -apple-system, sans-serif; }
    .bgp-modal-close { position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; background: #f1f5f9; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #475569; cursor: pointer; transition: all 0.2s; }
    .bgp-modal-close:hover { background: #fee2e2; color: #ef4444; transform: rotate(90deg); }

    /* ENGINE DE IMPRESSÃO TÉRMICA 55mm */
    @media screen { .bgp-print-area { display: none !important; } }
    @media print {
        html, body.bgp-print-thermal { background-color: #ffffff !important; margin: 0 !important; padding: 0 !important; }
        body.bgp-print-thermal #wpcontent, body.bgp-print-thermal #wpbody, body.bgp-print-thermal #wpbody-content { margin: 0 !important; padding: 0 !important; background-color: #ffffff !important; }
        body.bgp-print-thermal #wpadminbar, body.bgp-print-thermal #adminmenumain, body.bgp-print-thermal #adminmenuwrap, body.bgp-print-thermal #wpfooter, body.bgp-print-thermal .wrap.bgp-wrap, body.bgp-print-thermal .notice, body.bgp-print-thermal .update-nag { display: none !important; }
        body.bgp-print-thermal .bgp-print-area { display: block !important; position: absolute !important; left: 0 !important; top: 0 !important; width: 55mm !important; margin: 0 !important; padding: 0 !important; background: #ffffff !important; }
        body.bgp-print-thermal .bgp-label-gondola { width: 52mm !important; padding: 2mm !important; display: flex !important; flex-direction: column !important; font-family: 'Arial', sans-serif !important; color: #000 !important; }
        body.bgp-print-thermal .label-title { font-size: 11pt !important; font-weight: 900 !important; text-transform: uppercase !important; margin-bottom: 2mm !important; line-height: 1.1 !important; max-height: 2.3em !important; overflow: hidden !important; color: #000 !important; }
        body.bgp-print-thermal .label-bottom { display: flex !important; justify-content: space-between !important; align-items: flex-end !important; width: 100% !important; }
        body.bgp-print-thermal .label-price { display: flex !important; align-items: baseline !important; padding-left: 2mm !important; color: #000 !important; }
        body.bgp-print-thermal .label-price .currency { font-size: 12pt !important; font-weight: 900 !important; margin-right: 1mm !important; }
        body.bgp-print-thermal .label-price .value { font-size: 28pt !important; font-weight: 900 !important; letter-spacing: -1px !important; line-height: 0.8 !important; }
    }

/* BARRA DE NAVEGAÇÃO SUPERIOR (Painel, Produtos, Usuários) */
.bgp-topbar { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #ffffff; border-bottom: 1px solid #e2e8f0; padding: 12px 24px; flex-wrap: wrap; margin-bottom: 25px; }
.bgp-topbar-marca { display: flex; align-items: center; gap: 8px; font-weight: 900; font-size: 14px; color: #0f172a; white-space: nowrap; }
.bgp-topbar-nav { display: flex; gap: 4px; flex-wrap: wrap; flex: 1; }
.bgp-topbar-link { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 8px; color: #64748b; text-decoration: none; font-size: 13px; font-weight: 700; transition: all 0.15s; }
.bgp-topbar-link:hover { background: #f1f5f9; color: #334155; }
.bgp-topbar-link.ativo { background: #eff6ff; color: #2563eb; }
.bgp-topbar-usuario { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.bgp-topbar-usuario-nome { font-size: 13px; font-weight: 700; color: #334155; text-align: right; line-height: 1.3; }
.bgp-topbar-usuario-nome small { display: block; font-size: 10px; color: #94a3b8; font-weight: 600; }
.bgp-topbar-sair { background: #fee2e2; color: #b91c1c; border: none; border-radius: 8px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.15s; }
.bgp-topbar-sair:hover { background: #fecaca; }
.bgp-topbar-hamburguer { display: none; background: #f1f5f9; color: #334155; border: none; border-radius: 8px; width: 38px; height: 38px; align-items: center; justify-content: center; cursor: pointer; order: 2; }
.bgp-topbar-hamburguer .dashicons { font-size: 20px; width: 20px; height: 20px; }

@media (max-width: 782px) {
    .bgp-topbar { padding: 10px 15px; gap: 10px; justify-content: flex-start; }
    .bgp-topbar-marca span:last-child { display: none; }
    .bgp-topbar-usuario-nome { display: none; }

    .bgp-topbar-hamburguer { display: flex; order: -1; }
    .bgp-topbar-marca { order: 0; }
    .bgp-topbar-usuario { order: 1; margin-left: auto; }

    /* No mobile o menu vira um painel que abre pra baixo, com texto visível
       (em vez de tentar espremer 13+ ícones numa linha só, que quebrava tudo). */
    .bgp-topbar-nav {
        display: none; flex-direction: column; flex-wrap: nowrap; gap: 2px; flex: none;
        position: absolute; top: 100%; left: 0; right: 0; margin-top: 1px;
        background: #ffffff; border: 1px solid #e2e8f0; border-top: none;
        border-radius: 0 0 12px 12px; padding: 8px; box-shadow: 0 12px 25px rgba(15,23,42,0.1);
        z-index: 200; max-height: 70vh; overflow-y: auto; overflow-x: hidden;
    }
    .bgp-topbar-nav.aberto { display: flex; }
    .bgp-topbar-link { padding: 12px 14px; width: 100%; flex-shrink: 0; }
    .bgp-topbar-link-label { display: inline; }
}

.bgp-tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; margin-top: 10px; }

@media (max-width: 480px) {
    .bgp-wrap { padding: 0 14px; margin: 15px auto; }
    .bgp-card { padding: 18px; }
    .bgp-tools-grid { grid-template-columns: 1fr; gap: 14px; }
    .bgp-page-title { font-size: 20px; }
}