/*
 Copyrigth 2018 BAT-Software

 Versão de PRODUÇÃO (só a exportação para Excel): subconjunto do BATComponentes.css
 de desenvolvimento — campo/painel (separador "Registo de Exportações"), botão de
 ícone, modal e exportação. Carregado por ExportExcel_ajax_enqueue_scripts() em
 BATExportExcel.php. Quando o BATComponentes.css completo for publicado, substitui
 este ficheiro (mesmo handle 'BATComponentes').

 Breakpoint do projeto: 768px.
*/

/* ===== CAMPO DE FORMULÁRIO ===== */
.bat-campo {
  display: grid;
  grid-template-columns: minmax(120px, 200px) 1fr;
  gap: 6px 12px;
  align-items: start;
  margin-bottom: 10px;
}

.bat-campo > .bat-campo-label {
  text-align: right;
  font-weight: bold;
  padding-top: 6px;
}

.bat-campo > .bat-controlo {
  min-width: 0; /* permite encolher dentro da grid */
}

.bat-controlo select,
.bat-controlo input,
.bat-controlo textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* ===== PAINEL ===== */
.bat-painel {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #008ab7;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 10px;
}

/* Conteúdo largo que não controlamos (tabelas de admin) */
.bat-scroll-x {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ===== BOTÃO DE ÍCONE (BATBotaoIcone em includes/icones.php) ===== */
/* Glifo branco sobre o azul #003d99, como os ícones dos templates de email */
.bat-icone-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 2px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: #003d99;
  color: #ffffff;
  vertical-align: middle;
  cursor: pointer;
  box-sizing: border-box;
}

.bat-icone-btn:hover { background: #1B3A5F; }

.bat-icone-btn:focus-visible {
  outline: 3px solid #D4A853;
  outline-offset: 2px;
}

.bat-icone-btn[aria-busy="true"],
.bat-icone-btn[disabled] { opacity: .6; cursor: progress; }

.bat-icone {
  display: block;
  width: 24px;
  height: 24px;
  fill: currentColor;
}

/* ===== MODAL (BATModal em BATExportExcel.js) ===== */
/*
 Tokens no escopo do modal: mesmas cores do menu novo e dos templates de email.
 z-index acima da gaveta do menu (99999).
*/
.bat-modal {
  --bat-modal-azul:   #003d99;
  --bat-modal-tinta:  #1B3A5F;
  --bat-modal-ouro:   #D4A853;
  --bat-modal-creme:  #FFF9ED;
  --bat-modal-borda:  #008ab7;   /* a mesma do .bat-painel */
  --bat-modal-alvo:   44px;

  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: 100000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 6vh 16px 16px;
  box-sizing: border-box;
  font-size: 14px;
}

.bat-modal *,
.bat-modal *::before,
.bat-modal *::after { box-sizing: border-box; }

/* O JS esconde elementos com o atributo "hidden": reafirmá-lo contra regras display do tema */
.bat-modal [hidden] { display: none !important; }

.bat-modal-fundo {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  background: rgba(27,58,95,.45);
}

.bat-modal-caixa {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;   /* item flex: sem isto a grelha de campos alarga a caixa para lá do ecrã */
  max-width: 760px;
  max-height: 88vh;
  background: #ffffff;
  border: 1px solid var(--bat-modal-borda);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(27,58,95,.35);
  animation: bat-modal-entrar .18s ease-out;
}

@keyframes bat-modal-entrar {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

.bat-modal-cabecalho {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 3px solid var(--bat-modal-ouro);
}

.bat-modal-titulo {
  flex: 1;
  margin: 0;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.3em;
  line-height: 1.3;
  color: var(--bat-modal-tinta);
}

.bat-modal-fechar {
  flex: none;
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--bat-modal-tinta);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.bat-modal-fechar:hover { background: var(--bat-modal-creme); }

.bat-modal-corpo {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 14px 18px;
}

.bat-modal-rodape {
  padding: 12px 18px;
  border-top: 1px solid #e3e3e3;
  background: #fafafa;
  border-radius: 0 0 10px 10px;
}

.bat-modal-botoes {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.bat-modal :focus-visible {
  outline: 3px solid var(--bat-modal-ouro);
  outline-offset: 2px;
}

/* Bloqueio de scroll do documento enquanto o modal está aberto */
html.bat-modal-aberto { overflow: hidden; }

/* Botões do modal: o azul/branco dos botões de ação do plugin, em versão atual */
.bat-btn {
  min-height: 38px;
  padding: 8px 18px;
  border: 1px solid transparent;
  border-radius: 6px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.bat-btn--primario {
  background: var(--bat-modal-azul, #003d99);
  color: #ffffff;
}

.bat-btn--primario:hover:not([disabled]) { background: var(--bat-modal-tinta, #1B3A5F); }

.bat-btn--secundario {
  background: #ffffff;
  border-color: #b9c3cf;
  color: var(--bat-modal-tinta, #1B3A5F);
}

.bat-btn[disabled] {
  opacity: .5;
  cursor: not-allowed;
}

/* ===== EXPORTAÇÃO PARA EXCEL ===== */
.bat-export-btn[aria-busy="true"] { cursor: progress; opacity: .6; }

.bat-export-contexto {
  margin: 0 0 12px;
  color: var(--bat-modal-tinta);
}

.bat-export-barra {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 10px;
  background: var(--bat-modal-creme);
  border-radius: 6px;
}

.bat-export-todos { font-weight: bold; }

.bat-export-contador {
  font-size: .9em;
  color: #555;
}

.bat-export-grupos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.bat-export-grupo {
  margin: 0;
  padding: 6px 10px 10px;
  border: 1px solid #d6dde5;
  border-radius: 8px;
  min-width: 0;
}

.bat-export-grupo legend {
  padding: 0 4px;
  font-weight: bold;
  color: var(--bat-modal-tinta);
}

.bat-export-campos {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.bat-export-campo,
.bat-export-todos,
.bat-export-grupo legend label,
.bat-export-rgpd-aceito {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 3px 0;
  cursor: pointer;
  line-height: 1.35;
}

.bat-modal input[type=checkbox] {
  flex: none;
  width: auto;
  margin: 2px 0 0;
  accent-color: var(--bat-modal-azul);
}

.bat-export-sensivel {
  padding: 0 6px;
  border-radius: 8px;
  background: #fde8e8;
  color: #901b1d;
  font-size: .78em;
  line-height: 1.6;
  white-space: nowrap;
}

.bat-export-aviso-sensivel {
  margin: 10px 0 0;
  padding: 8px 10px;
  border-radius: 6px;
  background: #fde8e8;
  color: #901b1d;
}

.bat-export-rgpd {
  margin-top: 14px;
  padding: 10px 14px;
  background: var(--bat-modal-creme);
  border-left: 4px solid var(--bat-modal-ouro);
  border-radius: 6px;
  color: #4B3B2A;
}

.bat-export-rgpd p { margin: 0 0 8px; }

.bat-export-rgpd-titulo {
  font-weight: bold;
  color: var(--bat-modal-tinta);
}

.bat-export-rgpd-aceito { font-weight: bold; }

.bat-export-erro {
  margin: 10px 0 0;
  padding: 8px 10px;
  background-color: red;
  color: yellow;
}

@media (prefers-reduced-motion: reduce) {
  .bat-modal-caixa { animation: none; }
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {
  .bat-icone-btn {
    width: 48px;
    height: 48px;
  }

  /* Modal em ecrã inteiro, rodapé sempre visível */
  .bat-modal { padding: 0; }

  .bat-modal-caixa {
    max-width: none;
    height: 100%;
    max-height: none;
    border: 0;
    border-radius: 0;
  }

  .bat-modal-rodape { border-radius: 0; }

  .bat-modal-botoes .bat-btn { flex: 1; }

  .bat-export-grupos { grid-template-columns: 1fr; }

  .bat-btn,
  .bat-modal-fechar,
  .bat-export-campo,
  .bat-export-todos,
  .bat-export-grupo legend label,
  .bat-export-rgpd-aceito {
    min-height: var(--bat-modal-alvo, 44px);
  }

  .bat-export-campo,
  .bat-export-todos,
  .bat-export-grupo legend label,
  .bat-export-rgpd-aceito { align-items: center; }

  .bat-modal input[type=checkbox] {
    width: 20px;
    height: 20px;
    margin: 0;
  }

  .bat-campo {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .bat-campo > .bat-campo-label {
    text-align: left;
    padding-top: 0;
  }

  .bat-painel {
    padding: 8px;
    border-radius: 8px;
  }
}