/* ==========================================================================
   MEGH Produtos — Frontend CSS
   ========================================================================== */

/* ── Variáveis ─────────────────────────────────────────────────────────── */
:root {
  --megh-primary:     #0057b8;
  --megh-primary-dk:  #003d80;
  --megh-accent:      #00a8e8;
  --megh-text:        #1a1a2e;
  --megh-text-light:  #5a6272;
  --megh-bg:          #f7f9fc;
  --megh-white:       #ffffff;
  --megh-border:      #e2e8f0;
  --megh-success:     #10b981;
  --megh-warning:     #f59e0b;
  --megh-danger:      #ef4444;
  --megh-radius:      10px;
  --megh-shadow:      0 4px 24px rgba(0,87,184,0.10);
  --megh-transition:  0.22s cubic-bezier(0.4,0,0.2,1);
}

/* ── Página do Produto ──────────────────────────────────────────────────── */
.megh-produto-page {
  font-family: 'Inter', 'Segoe UI', sans-serif;
  color: var(--megh-text);
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 20px 60px;
}

/* Breadcrumb */
.megh-produto-breadcrumb {
  font-size: 0.82rem;
  color: var(--megh-text-light);
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.megh-produto-breadcrumb a {
  color: var(--megh-primary);
  text-decoration: none;
}
.megh-produto-breadcrumb a:hover { text-decoration: underline; }
.megh-produto-breadcrumb .current { color: var(--megh-text-light); }

/* Header */
.megh-produto-layout {}
.megh-produto-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 36px;
  background: linear-gradient(135deg, #f0f6ff 0%, var(--megh-white) 100%);
  border-radius: var(--megh-radius);
  border: 1px solid var(--megh-border);
  margin-bottom: 8px;
}
.megh-produto-header-inner { flex: 1; }

.megh-produto-badge-grupo {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.megh-badge {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 20px;
  background: rgba(0,87,184,0.10);
  color: var(--megh-primary);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
}
.megh-badge-bio {
  background: rgba(16,185,129,0.12);
  color: var(--megh-success);
}

.megh-produto-titulo {
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 8px;
  color: var(--megh-text);
  line-height: 1.2;
}
.megh-produto-codigo {
  font-size: 0.85rem;
  color: var(--megh-text-light);
  margin: 0 0 4px;
}
.megh-produto-nome-quimico {
  font-size: 0.92rem;
  color: var(--megh-text-light);
  margin: 0;
  font-style: italic;
}

/* Ações no header */
.megh-produto-acoes {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}

/* Botões */
.megh-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  text-decoration: none;
  transition: all var(--megh-transition);
  white-space: nowrap;
}
.megh-btn-primary {
  background: var(--megh-primary);
  color: var(--megh-white);
  border-color: var(--megh-primary);
}
.megh-btn-primary:hover {
  background: var(--megh-primary-dk);
  border-color: var(--megh-primary-dk);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,87,184,0.3);
  color: var(--megh-white);
  text-decoration: none;
}
.megh-btn-outline {
  background: transparent;
  color: var(--megh-primary);
  border-color: var(--megh-primary);
}
.megh-btn-outline:hover {
  background: var(--megh-primary);
  color: var(--megh-white);
  text-decoration: none;
}
.megh-btn-lg { padding: 14px 28px; font-size: 1rem; }

/* ── Tabs ───────────────────────────────────────────────────────────────── */
.megh-produto-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 2px solid var(--megh-border);
  margin-bottom: 0;
  overflow-x: auto;
}
.megh-tab {
  padding: 12px 22px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--megh-text-light);
  cursor: pointer;
  transition: all var(--megh-transition);
  white-space: nowrap;
}
.megh-tab:hover { color: var(--megh-primary); }
.megh-tab.active {
  color: var(--megh-primary);
  border-bottom-color: var(--megh-primary);
}

.megh-produto-tab-content {
  background: var(--megh-white);
  border: 1px solid var(--megh-border);
  border-top: none;
  border-radius: 0 0 var(--megh-radius) var(--megh-radius);
  padding: 32px;
  min-height: 300px;
}
.megh-tab-panel { display: none; }
.megh-tab-panel.active { display: block; animation: meghFadeIn 0.22s ease; }

@keyframes meghFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Descrição ──────────────────────────────────────────────────────────── */
.megh-produto-editor-content {
  line-height: 1.7;
  font-size: 0.95rem;
  color: var(--megh-text);
}

.megh-produto-info-exclusiva {
  margin-top: 28px;
  padding: 20px 24px;
  background: linear-gradient(135deg, #fffbeb, #fff7cd);
  border-left: 4px solid var(--megh-warning);
  border-radius: var(--megh-radius);
}
.megh-produto-info-exclusiva h3 { margin: 0 0 10px; font-size: 1rem; }
.megh-info-exclusiva-content { font-size: 0.93rem; line-height: 1.6; }

/* Cards Resumo */
.megh-produto-resumo-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 14px;
  margin-top: 28px;
}
.megh-resumo-card {
  background: var(--megh-bg);
  border: 1px solid var(--megh-border);
  border-radius: 8px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.megh-resumo-card .label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--megh-text-light);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.megh-resumo-card .valor {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--megh-text);
}

/* ── Tabela de Propriedades ─────────────────────────────────────────────── */
.megh-table-wrapper { overflow-x: auto; }
.megh-propriedades-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.megh-propriedades-table th {
  background: linear-gradient(135deg, var(--megh-primary), var(--megh-accent));
  color: var(--megh-white);
  padding: 12px 16px;
  text-align: left;
  font-weight: 600;
}
.megh-propriedades-table td {
  padding: 10px 16px;
  border-bottom: 1px solid var(--megh-border);
  color: var(--megh-text);
}
.megh-propriedades-table tbody tr:nth-child(even) { background: var(--megh-bg); }
.megh-propriedades-table tbody tr:hover { background: #eef4ff; }
.megh-nota-propriedades {
  font-size: 0.78rem;
  color: var(--megh-text-light);
  margin-top: 16px;
}

/* ── Aplicações ─────────────────────────────────────────────────────────── */
.megh-aplicacoes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}
.megh-aplicacao-card {
  background: var(--megh-bg);
  border: 1px solid var(--megh-border);
  border-radius: var(--megh-radius);
  padding: 18px 20px;
  transition: box-shadow var(--megh-transition), border-color var(--megh-transition);
}
.megh-aplicacao-card:hover {
  border-color: var(--megh-accent);
  box-shadow: var(--megh-shadow);
}
.megh-aplicacao-mercado {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--megh-primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 6px;
}
.megh-aplicacao-tipo {
  font-size: 1rem;
  font-weight: 700;
  color: var(--megh-text);
  margin-bottom: 4px;
}
.megh-aplicacao-sistema {
  font-size: 0.83rem;
  color: var(--megh-text-light);
  margin-bottom: 10px;
}
.megh-aplicacao-beneficios {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.megh-aplicacao-beneficios li {
  font-size: 0.83rem;
  color: var(--megh-text);
  padding-left: 16px;
  position: relative;
}
.megh-aplicacao-beneficios li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--megh-success);
  font-weight: 700;
}

/* ── Downloads PDF ──────────────────────────────────────────────────────── */
.megh-pdf-categoria { margin-bottom: 28px; }
.megh-pdf-cat-titulo {
  font-size: 0.92rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--megh-primary);
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--megh-border);
}
.megh-pdf-lista { display: flex; flex-direction: column; gap: 8px; }
.megh-pdf-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: var(--megh-bg);
  border: 1px solid var(--megh-border);
  border-radius: 8px;
  text-decoration: none;
  color: var(--megh-text);
  transition: all var(--megh-transition);
}
.megh-pdf-item:hover {
  background: #eef4ff;
  border-color: var(--megh-primary);
  text-decoration: none;
  color: var(--megh-primary);
  transform: translateX(4px);
}
.megh-pdf-item svg { color: #e74c3c; flex-shrink: 0; }
.megh-pdf-titulo { flex: 1; font-weight: 500; font-size: 0.92rem; }
.megh-pdf-download-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--megh-primary);
  opacity: 0;
  transition: opacity var(--megh-transition);
}
.megh-pdf-item:hover .megh-pdf-download-label { opacity: 1; }

/* ── Modal de Amostra ───────────────────────────────────────────────────── */
.megh-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.megh-modal[hidden] { display: none !important; }

.megh-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(10,15,30,0.6);
  backdrop-filter: blur(4px);
  cursor: pointer;
}
.megh-modal-box {
  position: relative;
  background: var(--megh-white);
  border-radius: 16px;
  padding: 40px;
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
  animation: meghModalIn 0.28s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes meghModalIn {
  from { opacity: 0; transform: scale(0.9) translateY(20px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

.megh-modal-close {
  position: absolute;
  top: 16px; right: 16px;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: none;
  background: var(--megh-bg);
  font-size: 1.3rem;
  color: var(--megh-text-light);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--megh-transition);
}
.megh-modal-close:hover { background: var(--megh-border); color: var(--megh-text); }

.megh-modal-box h2 {
  font-size: 1.5rem;
  font-weight: 800;
  margin: 0 0 6px;
  color: var(--megh-text);
}
.megh-modal-produto {
  font-size: 0.9rem;
  color: var(--megh-text-light);
  margin-bottom: 24px;
}

/* Formulário */
.megh-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.megh-form-group { display: flex; flex-direction: column; gap: 6px; }
.megh-form-group--full { grid-column: 1 / -1; }
.megh-form-group label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--megh-text);
}
.megh-form-group label span { color: var(--megh-danger); }
.megh-form-group input,
.megh-form-group textarea,
.megh-form-group select {
  padding: 10px 14px;
  border: 1.5px solid var(--megh-border);
  border-radius: 8px;
  font-size: 0.92rem;
  color: var(--megh-text);
  background: var(--megh-bg);
  transition: border var(--megh-transition), box-shadow var(--megh-transition);
  font-family: inherit;
}
.megh-form-group input:focus,
.megh-form-group textarea:focus {
  outline: none;
  border-color: var(--megh-primary);
  box-shadow: 0 0 0 3px rgba(0,87,184,0.12);
  background: var(--megh-white);
}

.megh-form-actions { margin-top: 24px; }
.megh-form-feedback {
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 0.92rem;
  margin-bottom: 14px;
}
.megh-form-feedback.success {
  background: rgba(16,185,129,0.1);
  color: #065f46;
  border: 1px solid var(--megh-success);
}
.megh-form-feedback.error {
  background: rgba(239,68,68,0.1);
  color: #991b1b;
  border: 1px solid var(--megh-danger);
}

/* ══════════════════════════════════════════════════════════════════════════
   WIDGETS DE DETALHE DO PRODUTO — Elementor
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Componente base: Título de Seção c/ linha abaixo ───────────────────── */
.megh-prop-secao-titulo,
.megh-merc-secao-titulo {
  border-bottom: 1px solid #ddd;
  padding-bottom: 8px;
  margin-bottom: 14px;
}
.megh-prop-titulo,
.megh-merc-titulo {
  font-size: 0.92rem;
  font-weight: 700;
  color: #111;
  letter-spacing: 0;
}

/* ── Widget: Cabeçalho do Produto ───────────────────────────────────────── */
.megh-ph-header {
  font-family: inherit;
}
.megh-ph-familia {
  font-size: 0.78rem;
  color: #888;
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.megh-ph-titulo {
  font-size: clamp(1.3rem, 2.5vw, 1.9rem);
  font-weight: 700;
  color: #0057b8;
  margin: 0 0 6px;
  line-height: 1.25;
}
.megh-ph-codigo {
  font-size: 0.78rem;
  color: #999;
  font-family: monospace;
  margin-bottom: 4px;
}
.megh-ph-subtitulo {
  font-size: 0.95rem;
  color: #444;
  margin: 0;
  line-height: 1.5;
}

/* ── Widget: Propriedades Físico-Químicas ───────────────────────────────── */
.megh-prop-wrapper {
  font-family: inherit;
}
.megh-prop-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}
.megh-prop-row {
  border-bottom: 1px solid #e8e8e8;
}
.megh-prop-row:last-child { border-bottom: none; }
.megh-prop-row td {
  padding: 10px 16px 10px 0;
  vertical-align: top;
  line-height: 1.5;
}
.megh-prop-row td:last-child { padding-right: 0; }
.megh-prop-label {
  color: #222;
  font-weight: 400;
  width: 38%;
  min-width: 160px;
}
.megh-prop-metodo {
  color: #888;
  font-size: 0.82rem;
  width: 10%;
  white-space: nowrap;
}
.megh-prop-valor {
  color: #444;
  font-weight: 400;
}
.megh-prop-nota {
  font-size: 0.78rem;
  color: #999;
  font-style: italic;
  margin-top: 14px;
  margin-bottom: 0;
}
.megh-prop-vazia {
  color: #bbb;
  font-size: 0.88rem;
}

/* ── Widget: Mercados / Aplicações ──────────────────────────────────────── */
.megh-merc-wrapper {
  font-family: inherit;
}
.megh-merc-lista {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.megh-merc-colunas-2 { columns: 2; display: block; }
.megh-merc-colunas-3 { columns: 3; display: block; }
.megh-merc-item {
  font-size: 0.88rem;
  color: #333;
  line-height: 1.6;
}
.megh-merc-vazio {
  color: #bbb;
  font-size: 0.88rem;
}

/* ── Widget: Botões de Ação ─────────────────────────────────────────────── */
.megh-acoes-wrapper {
  font-family: inherit;
}
.megh-acoes-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.megh-acao-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 22px;
  border: 1px solid #333;
  border-radius: 100px;
  background: transparent;
  color: #111;
  font-size: 0.85rem;
  font-weight: 400;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
  letter-spacing: 0.01em;
  transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
  white-space: nowrap;
}
.megh-acao-btn:hover {
  background-color: #111;
  border-color: #111;
  color: #fff;
  text-decoration: none;
}
.megh-acao-btn--disabled {
  cursor: default;
  opacity: 0.4;
}
.megh-acao-btn--disabled:hover {
  background-color: transparent;
  border-color: #333;
  color: #111;
}

/* Responsivo dos widgets de detalhe */
@media (max-width: 640px) {
  .megh-prop-metodo { display: none; }
  .megh-prop-label  { width: 48%; }
  .megh-merc-colunas-2,
  .megh-merc-colunas-3 { columns: 1; }
  .megh-acoes-row { flex-direction: column; align-items: flex-start; }
}

/* ── Widget Catálogo Tabular (Elementor) ────────────────────────────────── */

.megh-cat-wrapper {
  width: 100%;
  overflow-x: auto;
  /* Garante que a fonte herde do tema */
  font-family: inherit;
}

.megh-cat-table {
  width: 100%;
  /* border-collapse separate + border-spacing zero = controle total das bordas */
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 0.88rem;
}

/* ──────────────────────────────────────────────────────────
   Cabeçalho
   Duas linhas: uma ACIMA e uma ABAIXO dos th.
   Com border-collapse:collapse, basta setar border-top e
   border-bottom nos próprios <th>.
   ────────────────────────────────────────────────────────── */
.megh-cat-th {
  text-align: left;
  font-size: 0.68rem;       /* menor que o conteúdo */
  font-weight: 400;         /* proposta: leveza, sem negrito */
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #aaa;              /* cinza bem claro — proposta */
  padding: 14px 24px 14px 0;
  white-space: nowrap;
  border-top:    1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background: transparent;
}
.megh-cat-th:last-child  { padding-right: 0; }
.megh-cat-th-produto     { min-width: 180px; }

/* ──────────────────────────────────────────────────────────
   Linhas de dados
   ────────────────────────────────────────────────────────── */
.megh-cat-row {
  border-bottom: 1px solid #e8e8e8;
  transition: background-color 0.15s ease;
}
.megh-cat-row:hover {
  background-color: #f8fafd;
}
/* Linha ativa (produto sendo visualizado) */
.megh-cat-row--active {
  background-color: #f0f7ff;
}
.megh-cat-row--active .megh-cat-produto a {
  color: #0057b8;
}

/* Células */
.megh-cat-row td {
  padding: 13px 24px 13px 0;
  vertical-align: middle;
}
.megh-cat-row td:last-child { padding-right: 0; }

/* Coluna: Produto — levemente mais escuro que os dados */
.megh-cat-produto a {
  color: #111;
  text-decoration: none;
  font-weight: 400;         /* proposta: mesmo peso do corpo, destaque só pela cor */
  font-size: 0.88rem;
  line-height: 1.45;
  transition: color 0.14s ease;
  display: block;
}
.megh-cat-produto a:hover {
  color: #0057b8;
  text-decoration: none;
}

/* Colunas de dados: levemente mais claros */
.megh-cat-cell {
  color: #444;
  font-size: 0.88rem;
  font-weight: 400;
  line-height: 1.45;
}

/* Placeholder quando não há produtos */
.megh-cat-vazio {
  color: #bbb;
  padding: 20px 0;
  font-size: 0.88rem;
}

/* ──────────────────────────────────────────────────────────
   Responsivo — oculta colunas em telas menores
   ────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  /* Oculta Forma Física em tablets */
  .megh-cat-th:nth-child(4),
  .megh-cat-row td:nth-child(4) { display: none; }
}
@media (max-width: 640px) {
  /* Mantém só Produto + uma coluna */
  .megh-cat-th:nth-child(3),
  .megh-cat-row td:nth-child(3),
  .megh-cat-th:nth-child(4),
  .megh-cat-row td:nth-child(4) { display: none; }
  .megh-cat-th,
  .megh-cat-row td { padding-right: 10px; }
}


/* ── Paginação do Catálogo Tabular ──────────────────────────────────────── */

/* Topbar com seletor de quantidade */
.megh-cat-pag-topbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.megh-cat-pag-label {
  font-size: 0.78rem;
  color: #888;
  white-space: nowrap;
}
.megh-cat-pag-select {
  font-size: 0.78rem;
  color: #333;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 4px 8px;
  background: #fff;
  cursor: pointer;
  font-family: inherit;
  transition: border-color 0.15s ease;
}
.megh-cat-pag-select:focus {
  outline: none;
  border-color: #0057b8;
}

/* Barra de paginação (rodapé da tabela) */
.megh-cat-paginacao {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #e8e8e8;
}
.megh-cat-pag-info {
  font-size: 0.78rem;
  color: #888;
  white-space: nowrap;
}
.megh-cat-pag-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}
.megh-cat-pag-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  padding: 0 6px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  color: #333;
  font-size: 0.78rem;
  cursor: pointer;
  font-family: inherit;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  line-height: 1;
}
.megh-cat-pag-btn:hover:not(:disabled):not(.active) {
  background-color: #f0f6ff;
  border-color: #0057b8;
  color: #0057b8;
}
.megh-cat-pag-btn.active {
  background-color: #0057b8;
  border-color: #0057b8;
  color: #fff;
  font-weight: 600;
  cursor: default;
}
.megh-cat-pag-btn.disabled,
.megh-cat-pag-btn:disabled {
  opacity: 0.35;
  cursor: default;
}
.megh-cat-pag-dots {
  font-size: 0.78rem;
  color: #aaa;
  padding: 0 2px;
  line-height: 30px;
}

/* Legacy: lista simples (mantida para retrocompatibilidade) */
.megh-lista-produtos-widget {
  list-style: none;
  padding: 0;
  margin: 0;
}
.megh-lista-produto-item {
  border-bottom: 1px solid var(--megh-border);
}
.megh-lista-produto-item:last-child { border-bottom: none; }
.megh-lista-produto-item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  text-decoration: none;
  color: var(--megh-text);
  font-size: 0.9rem;
  font-weight: 500;
  transition: all var(--megh-transition);
  border-left: 3px solid transparent;
  gap: 8px;
}
.megh-lista-produto-item:hover a,
.megh-lista-produto-item.active a {
  color: var(--megh-primary);
  background: #f0f7ff;
  border-left-color: var(--megh-primary);
  padding-left: 18px;
}
.megh-lista-nome { flex: 1; }
.megh-lista-codigo {
  font-size: 0.72rem;
  color: var(--megh-text-light);
  font-family: monospace;
  flex-shrink: 0;
}
.megh-lista-vazia {
  color: var(--megh-text-light);
  font-size: 0.88rem;
  padding: 16px;
  text-align: center;
}


/* ── Busca Global ───────────────────────────────────────────────────────── */
.megh-busca-container {
  position: relative;
}
.megh-busca-input {
  width: 100%;
  padding: 14px 46px 14px 18px;
  border: 2px solid var(--megh-border);
  border-radius: 40px;
  font-size: 0.96rem;
  background: var(--megh-white);
  color: var(--megh-text);
  transition: all var(--megh-transition);
  font-family: inherit;
}
.megh-busca-input:focus {
  outline: none;
  border-color: var(--megh-primary);
  box-shadow: 0 0 0 3px rgba(0,87,184,0.12);
}
.megh-busca-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--megh-text-light);
  pointer-events: none;
}
.megh-busca-loading {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  display: none;
}
.megh-busca-loading.show { display: block; }

.megh-busca-resultados {
  position: absolute;
  top: calc(100% + 8px);
  left: 0; right: 0;
  background: var(--megh-white);
  border: 1px solid var(--megh-border);
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  max-height: 400px;
  overflow-y: auto;
  z-index: 9999;
  display: none;
}
.megh-busca-resultados.show { display: block; animation: meghFadeIn 0.18s ease; }

.megh-busca-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  text-decoration: none;
  color: var(--megh-text);
  border-bottom: 1px solid var(--megh-border);
  transition: background var(--megh-transition);
  font-size: 0.9rem;
}
.megh-busca-item:last-child { border-bottom: none; }
.megh-busca-item:hover { background: #f0f7ff; color: var(--megh-primary); text-decoration: none; }
.megh-busca-item-info { flex: 1; }
.megh-busca-item-nome { font-weight: 600; display: block; }
.megh-busca-item-familia { font-size: 0.78rem; color: var(--megh-text-light); }
.megh-busca-sem-resultado {
  padding: 16px;
  text-align: center;
  color: var(--megh-text-light);
  font-size: 0.88rem;
}
.megh-busca-modo-ia {
  padding: 8px 16px;
  font-size: 0.76rem;
  color: var(--megh-text-light);
  background: var(--megh-bg);
  border-bottom: 1px solid var(--megh-border);
  display: flex;
  align-items: center;
  gap: 5px;
}

/* ── Responsivo ─────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .megh-produto-header {
    flex-direction: column;
    gap: 20px;
    padding: 24px;
  }
  .megh-produto-acoes {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .megh-form-grid { grid-template-columns: 1fr; }
  .megh-produto-tab-content { padding: 20px; }
  .megh-aplicacoes-grid { grid-template-columns: 1fr; }
  .megh-modal-box { padding: 24px; }
}

@media (max-width: 480px) {
  .megh-produto-tabs { gap: 0; }
  .megh-tab { padding: 10px 14px; font-size: 0.82rem; }
  .megh-produto-resumo-cards { grid-template-columns: 1fr 1fr; }
}

/* ══════════════════════════════════════════════════════════════════════════
   WIDGET: BUSCA SEMÂNTICA DE PRODUTOS (megh-search-widget)
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Wrapper geral ──────────────────────────────────────────────────────── */
.megh-search-widget {
  position: relative;
  font-family: inherit;
}

/* ── Campo: wrap pill ───────────────────────────────────────────────────── */
.megh-sw-wrap {
  position: relative;
  display: flex;
  align-items: center;
  border: 1.5px solid #d1d5db;
  border-radius: 100px;        /* pill — sobrescrito pelo controle do Elementor */
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden;
}
.megh-sw-wrap:focus-within {
  border-color: #0057b8;
  box-shadow: 0 0 0 3px rgba(0,87,184,0.12);
}

/* ── Input ──────────────────────────────────────────────────────────────── */
.megh-sw-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  padding: 12px 20px;
  font-size: 0.96rem;
  font-family: inherit;
  color: inherit;
  min-width: 0;
  /* Remove o "x" nativo do tipo search em WebKit */
  -webkit-appearance: none;
}
.megh-sw-input::-webkit-search-cancel-button { display: none; }
.megh-sw-input::placeholder { color: #9ca3af; }

/* ── Ícone de lupa — agora é um <button> clicável ───────────────────────── */
.megh-sw-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px 0 8px;
  color: #9ca3af;
  flex-shrink: 0;
  cursor: pointer;
  /* Reset button */
  border: none;
  background: transparent;
  transition: color 0.2s ease;
}
.megh-sw-icon:hover { color: #0057b8; }
.megh-sw-wrap:focus-within .megh-sw-icon { color: #0057b8; }

/* ── Botão "Buscar" (opcional) ──────────────────────────────────────────── */
.megh-sw-btn {
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 600;
  background-color: #0057b8;
  color: #fff;
  padding: 12px 24px;
  white-space: nowrap;
  transition: background-color 0.18s ease;
  flex-shrink: 0;
  border-radius: 0 100px 100px 0; /* arredonda só o lado direito */
}
.megh-sw-btn:hover { background-color: #003d80; }

/* ── Spinner de loading ─────────────────────────────────────────────────── */
.megh-sw-loading {
  display: none;
  align-items: center;
  padding: 0 14px 0 8px;
}
.megh-sw-loading.show { display: flex; }
.megh-sw-spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(0,87,184,0.15);
  border-top-color: #0057b8;
  border-radius: 50%;
  animation: meghSpin 0.65s linear infinite;
}
@keyframes meghSpin { to { transform: rotate(360deg); } }

/* ── Painel de resultados ───────────────────────────────────────────────── */
.megh-sw-results {
  position: absolute;
  top: calc(100% + 8px);
  left: -40px;
  right: -40px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 12px 48px rgba(0,0,0,0.18);
  max-height: 440px;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 9999;
  animation: meghFadeIn 0.18s ease;
  /* scrollbar fina */
  scrollbar-width: thin;
  scrollbar-color: #d1d5db transparent;
}
.megh-sw-results::-webkit-scrollbar { width: 6px; }
.megh-sw-results::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }

/* ── Badge: Modo IA ─────────────────────────────────────────────────────── */
.megh-sw-badge-ia {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  font-size: 0.73rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #6d28d9;
  background: #f5f3ff;
  border-bottom: 1px solid #ede9fe;
}

/* ── Item de resultado ──────────────────────────────────────────────────── */
.megh-sw-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid #f1f5f9;
  transition: background-color 0.15s ease;
  cursor: pointer;
}
.megh-sw-item:last-child { border-bottom: none; }
.megh-sw-item:hover { background-color: #f0f6ff; text-decoration: none; }

/* Thumbnail */
.megh-sw-item-thumb {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}
.megh-sw-item-thumb-placeholder {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #cbd5e1;
}

/* Info: nome + metadados */
.megh-sw-item-body { flex: 1; min-width: 0; }
.megh-sw-item-nome {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  color: #111;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.15s ease;
}
.megh-sw-item:hover .megh-sw-item-nome { color: #0057b8; }

.megh-sw-item-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.megh-sw-item-familia,
.megh-sw-item-forma {
  font-size: 0.74rem;
  color: #6b7280;
}
.megh-sw-item-familia::after { content: '·'; margin-left: 8px; }
.megh-sw-item-familia:last-of-type::after { content: ''; margin: 0; }

/* Código (lado direito) */
.megh-sw-item-cod {
  font-size: 0.72rem;
  color: #9ca3af;
  font-family: monospace;
  flex-shrink: 0;
}

/* ── Estado "sem resultado" ─────────────────────────────────────────────── */
.megh-sw-sem-resultado {
  padding: 24px 16px;
  text-align: center;
  color: #9ca3af;
  font-size: 0.88rem;
}

/* ── Responsivo ─────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .megh-sw-results { left: 0; right: 0; }
  .megh-sw-item-cod      { display: none; }
  .megh-sw-item-thumb,
  .megh-sw-item-thumb-placeholder { width: 36px; height: 36px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   OVERLAY DE RESULTADOS COMPLETOS (megh-sw-overlay)
   Abre ao clicar na lupa/botão — mostra listagem paginada de todos os resultados
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Fundo escuro ────────────────────────────────────────────────────────── */
.megh-sw-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(8, 12, 28, 0.65);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 48px 20px 40px;
  animation: meghSwOvIn 0.22s ease;
  overflow-y: auto;
}
@keyframes meghSwOvIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.megh-sw-overlay[hidden] {
  display: none !important;
}

/* ── Caixa interna ───────────────────────────────────────────────────────── */
.megh-sw-overlay-box {
  background: #fff;
  border-radius: 16px;
  width: 100%;
  max-width: 820px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
  animation: meghSwBoxIn 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
@keyframes meghSwBoxIn {
  from { opacity: 0; transform: translateY(-24px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Header do overlay ───────────────────────────────────────────────────── */
.megh-sw-ov-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
}
.megh-sw-ov-input-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  border: 1.5px solid #d1d5db;
  border-radius: 100px;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.megh-sw-ov-input-wrap:focus-within {
  border-color: #0057b8;
  box-shadow: 0 0 0 3px rgba(0, 87, 184, 0.12);
}
.megh-sw-ov-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 11px 18px;
  font-size: 0.96rem;
  font-family: inherit;
  color: #111;
  background: transparent;
}
.megh-sw-ov-input::placeholder { color: #9ca3af; }
.megh-sw-ov-close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: #f1f5f9;
  color: #6b7280;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.megh-sw-ov-close:hover { background: #e2e8f0; color: #111; }

/* ── Barra de status ─────────────────────────────────────────────────────── */
.megh-sw-ov-status {
  padding: 10px 24px 8px;
  font-size: 0.82rem;
  color: #6b7280;
  background: #f8fafc;
  border-bottom: 1px solid #f1f5f9;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  min-height: 38px;
}
.megh-sw-ov-status-ia {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #6d28d9;
  font-weight: 600;
  font-size: 0.75rem;
}

/* ── Lista de resultados ─────────────────────────────────────────────────── */
.megh-sw-ov-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
  min-height: 200px;
  max-height: 55vh;
  scrollbar-width: thin;
  scrollbar-color: #d1d5db transparent;
}
.megh-sw-ov-list::-webkit-scrollbar { width: 5px; }
.megh-sw-ov-list::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }

/* Item da listagem completa */
.megh-sw-ov-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 24px;
  text-decoration: none;
  color: #111;
  border-bottom: 1px solid #f1f5f9;
  transition: background-color 0.15s;
}
.megh-sw-ov-item:last-child { border-bottom: none; }
.megh-sw-ov-item:hover { background: #f0f6ff; text-decoration: none; }

.megh-sw-ov-thumb {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid #e2e8f0;
  background: #f1f5f9;
}
.megh-sw-ov-thumb-ph {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #f1f5f9;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #cbd5e1;
}
.megh-sw-ov-body { flex: 1; min-width: 0; }
.megh-sw-ov-nome {
  font-size: 0.92rem;
  font-weight: 600;
  color: #111;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.15s;
}
.megh-sw-ov-item:hover .megh-sw-ov-nome { color: #0057b8; }
.megh-sw-ov-meta {
  display: flex;
  gap: 10px;
  margin-top: 2px;
  font-size: 0.76rem;
  color: #6b7280;
  flex-wrap: wrap;
}
.megh-sw-ov-forma::before { content: '·'; margin-right: 10px; }
.megh-sw-ov-cod {
  font-size: 0.72rem;
  color: #9ca3af;
  font-family: monospace;
  flex-shrink: 0;
}

/* Vazio */
.megh-sw-ov-empty {
  padding: 48px 24px;
  text-align: center;
  color: #9ca3af;
  font-size: 0.9rem;
}

/* Loading dentro do overlay */
.megh-sw-ov-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 56px 0;
  gap: 10px;
  color: #9ca3af;
  font-size: 0.88rem;
}

/* ── Paginação ───────────────────────────────────────────────────────────── */
.megh-sw-ov-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 16px 24px;
  border-top: 1px solid #f1f5f9;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.megh-sw-ov-pg-btn {
  min-width: 36px;
  height: 36px;
  border-radius: 8px;
  border: 1.5px solid #e2e8f0;
  background: #fff;
  color: #374151;
  font-size: 0.88rem;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  transition: all 0.15s ease;
  font-family: inherit;
}
.megh-sw-ov-pg-btn:hover:not(:disabled) {
  border-color: #0057b8;
  color: #0057b8;
  background: #f0f6ff;
}
.megh-sw-ov-pg-btn.active {
  background: #0057b8;
  border-color: #0057b8;
  color: #fff;
}
.megh-sw-ov-pg-btn:disabled {
  opacity: 0.4;
  cursor: default;
}
.megh-sw-ov-pg-dots {
  color: #9ca3af;
  font-size: 0.88rem;
  padding: 0 4px;
  align-self: flex-end;
  line-height: 36px;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .megh-sw-overlay { padding: 20px 12px; }
  .megh-sw-overlay-box { border-radius: 12px; }
  .megh-sw-ov-header { padding: 14px 16px 12px; }
  .megh-sw-ov-item { padding: 12px 16px; gap: 10px; }
  .megh-sw-ov-cod { display: none; }
  .megh-sw-ov-pagination { padding: 12px 16px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   RODAPÉ DE AÇÕES — Dropdown de busca rápida
   Botões "Ver mais" e "Ver tudo" no fundo do painel de autocomplete
   ══════════════════════════════════════════════════════════════════════════ */

.megh-sw-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  border-top: 1px solid #f1f5f9;
  background: #f8fafc;
  border-radius: 0 0 12px 12px;
  flex-wrap: wrap;
}

.megh-sw-footer-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  border-radius: 100px;
  padding: 8px 18px;
  transition: all 0.16s ease;
  white-space: nowrap;
  flex: 1;
  justify-content: center;
}

/* "Ver mais" — estilo primário com borda */
.megh-sw-footer-btn--mais {
  border: 1.5px solid #0057b8;
  background: transparent;
  color: #0057b8;
}
.megh-sw-footer-btn--mais:hover {
  background: #0057b8;
  color: #fff;
}

/* "Ver tudo" — estilo ghost sutil */
.megh-sw-footer-btn--tudo {
  border: 1.5px solid #d1d5db;
  background: transparent;
  color: #374151;
}
.megh-sw-footer-btn--tudo:hover {
  border-color: #6b7280;
  color: #111;
  text-decoration: none;
}

/* ── Rodapé "Ver tudo" dentro do overlay (ao final da lista) ─────────────── */
.megh-sw-ov-footer {
  padding: 12px 24px;
  border-top: 1px solid #f1f5f9;
  background: #f8fafc;
  display: flex;
  justify-content: center;
}

.megh-sw-ov-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #374151;
  text-decoration: none;
  border: 1.5px solid #d1d5db;
  border-radius: 100px;
  padding: 7px 18px;
  transition: all 0.15s ease;
  background: transparent;
}
.megh-sw-ov-footer-link:hover {
  border-color: #0057b8;
  color: #0057b8;
  background: #f0f6ff;
  text-decoration: none;
}

@media (max-width: 480px) {
  .megh-sw-footer { flex-direction: column; gap: 6px; }
  .megh-sw-footer-btn { width: 100%; justify-content: center; }
}

