/*
  Notificações de Licitações – Tailwind class shim for Bootstrap 4.1 sites
  --------------------------------------------------------------------
  Objetivo: manter o HTML do plugin intacto (com classes tipo Tailwind)
  e fornecer CSS equivalente usando escala/valores compatíveis com
  Bootstrap 4.1.

  Como usar:
  - Enfileire este CSS pelo TEMA (functions.php) ou via seu pipeline.
  - Não altera o PHP do plugin.

  Exemplo (tema):
    add_action('wp_enqueue_scripts', function(){
      wp_enqueue_style('nl-shim', get_stylesheet_directory_uri().'/css/notificacoes-licitacoes-bootstrap41-shim.css', [], '1.0');
    });

  Você pode sobrescrever as cores em :root (abaixo) no seu tema.
*/

:root {
  /* Paleta "azul-*" (fallback). Ajuste para bater com a identidade visual do seu site. */
  --nl-azul-200: #cfe2ff; /* próximo do Bootstrap primary-100/200 */
  --nl-azul-400: #6ea8fe; /* similar a blue-400 */
  --nl-azul-800: #0b5ed7; /* próximo do btn-primary */
  --nl-azul-900: #084298; /* azul mais escuro */

  /* Tons Tailwind-ish usados nas mensagens */
  --nl-green-100: #d1e7dd; /* bg-success-subtle (bs5) / similar */
  --nl-green-800: #0f5132;
  --nl-yellow-100: #fff3cd;
  --nl-yellow-800: #664d03;
  --nl-red-100: #f8d7da;
  --nl-red-800: #842029;
  --nl-gray-400: #ced4da; /* próximo de $gray-400 do BS4 */
}

/* Espaçamentos (equivalentes ao BS4) */
.mb-4 { margin-bottom: 1.5rem !important; }
.p-3  { padding: 1rem !important; }
.py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
.px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }

/* Largura */
.w-full { width: 100% !important; }

/* Bordas e arredondamentos */
.border-2 { border-width: 2px !important; border-style: solid !important; }
.rounded { border-radius: .25rem !important; }
.rounded-xl { border-radius: .75rem !important; }

/* Cores de background e texto (mensagens) */
.bg-green-100 { background-color: var(--nl-green-100) !important; }
.text-green-800 { color: var(--nl-green-800) !important; }

.bg-yellow-100 { background-color: var(--nl-yellow-100) !important; }
.text-yellow-800 { color: var(--nl-yellow-800) !important; }

.bg-red-100 { background-color: var(--nl-red-100) !important; }
.text-red-800 { color: var(--nl-red-800) !important; }

/* Cores custom "azul-*" usadas no formulário */
.border-azul-400 { border-color: var(--nl-azul-400) !important; }
.bg-azul-800 { background-color: var(--nl-azul-800) !important; }
.text-azul-200 { color: var(--nl-azul-200) !important; }
.border-azul-800 { border-color: var(--nl-azul-800) !important; }

/* Interações / transições */
.transition-colors { transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !important; }

/* Foco (classes com ":" precisam de escape no CSS) */
.focus\:outline-none:focus { outline: 0 !important; }

/* "ring" equivalente (box-shadow) */
.focus\:ring-2:focus {
  box-shadow: 0 0 0 .2rem rgba(11, 94, 215, .25) !important; /* similar a focus do btn-primary */
}

/* ring/cores custom */
.focus\:ring-azul-400:focus {
  box-shadow: 0 0 0 .2rem rgba(110, 168, 254, .35) !important;
}

.focus\:border-azul-900:focus {
  border-color: var(--nl-azul-900) !important;
}

/* Placeholder */
.placeholder\:text-gray-400::placeholder {
  color: var(--nl-gray-400) !important;
  opacity: 1;
}

/* Ajustes de inputs para ficar com "cara" de BS4 quando o tema não aplica */
input.py-2.px-4.rounded-xl.border-2 {
  display: block;
  height: calc(1.5em + .75rem + 2px);
  font-size: 1rem;
  line-height: 1.5;
  background-clip: padding-box;
}

/* Botão (fallback) */
button.bg-azul-800.text-azul-200.border-azul-800 {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  line-height: 1.5;
}

button.bg-azul-800.text-azul-200.border-azul-800:hover {
  filter: brightness(0.95);
}

/* Melhor contraste em telas pequenas */
@media (max-width: 575.98px) {
  .px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
}
