/* ===== Éppi – Tema oficial (Roxo/Laranja) + Poppins ===== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

:root {
  /* Paleta oficial */
  --eppi-primary: #9217AF;   /* Roxo */
  --eppi-secondary: #F3732B; /* Laranja */

  /* Tons auxiliares */
  --eppi-primary-dark: #7d1294;
  --eppi-secondary-dark: #d55e20;

  /* Compatibilidade */
  --wl-primary-color: var(--eppi-primary);
  --wl-secundary-color: var(--eppi-secondary);
  --wl-secondary-color: var(--eppi-secondary);

  --text: #333333;
  --bg: #fafafa;
  --whats-green: #25D366; /* WhatsApp oficial */
}

/* ===== Fonte global ===== */
html, body {
  font-family: 'Poppins', sans-serif;
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
}

/* ===== MENU LATERAL ===== */
.side-nav, 
.side-nav a, 
.side-nav .collapsible a, 
.side-nav .nav-item a {
  color: var(--eppi-primary) !important; /* Roxo no fundo branco */
  background-color: #ffffff !important;
}

.side-nav a:hover,
.side-nav .collapsible a:hover {
  color: var(--eppi-secondary) !important; /* Laranja no hover */
  background-color: #f5f5f5 !important;
}

.side-nav .nav-item .nav-link.active,
.side-nav .collapsible a.active {
  color: #ffffff !important;
  background-color: var(--eppi-primary) !important;
  border-right: 5px solid var(--eppi-secondary) !important;
}

/* ===== LOGO ===== */
#topo_menu_logo {
  height: 56px !important;
  max-height: 12vh;
  transition: height .2s ease;
}
@media (max-width: 576px) {
  #topo_menu_logo { height: 44px !important; }
}

/* Importa a fonte Poppins do Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

/* Importa a fonte Poppins do Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

/* ===== LOGIN/HOME (original com ajustes mínimos) ===== */
.login-wrapper {
  width: 100%;
  min-height: auto;
  height: 100%;
  background: var(--wl-secundary-color);
  background: linear-gradient(45deg, var(--wl-secundary-color) 40%, var(--wl-primary-color) 100%);
  font-family: 'Poppins', sans-serif; /* Fonte alterada */
}

/* Botão principal roxo */
.btn-primary,
#form_login button,
#form_login input[type="submit"] {
  background-color: var(--wl-primary-color) !important;
  border-color: var(--wl-primary-color) !important;
  color: #fff !important;
  font-family: 'Poppins', sans-serif; /* fonte aplicada também no botão */
}

.btn-primary:hover,
#form_login button:hover,
#form_login input[type="submit"]:hover {
  filter: brightness(0.9);
}
/* ===== BOTÕES ===== */
.btn-primary,
button,
input[type="submit"] {
  background-color: var(--eppi-primary) !important;
  border: 1px solid var(--eppi-primary) !important;
  color: #ffffff !important;
  font-weight: 600;
  border-radius: 6px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.btn-primary:hover,
button:hover,
input[type="submit"]:hover {
  background-color: var(--eppi-primary-dark) !important;
  border-color: var(--eppi-primary-dark) !important;
}

.btn-primary:disabled,
button:disabled,
input[type="submit"]:disabled {
  background-color: #cccccc !important;
  border-color: #cccccc !important;
  color: #666666 !important;
  cursor: not-allowed;
}

/* Botões secundários em laranja */
.btn-secondary,
.btn-teal,
#btn-chat-online {
  background-color: var(--eppi-secondary) !important;
  border: 1px solid var(--eppi-secondary) !important;
  color: #ffffff !important;
}

.btn-secondary:hover,
.btn-teal:hover,
#btn-chat-online:hover {
  background-color: var(--eppi-secondary-dark) !important;
  border-color: var(--eppi-secondary-dark) !important;
}

/* ===== LINKS ===== */
a {
  color: var(--eppi-primary) !important;
}
a:hover {
  color: var(--eppi-secondary) !important;
}

/* ===== WHATSAPP NO TOPO ===== */
.fa-whatsapp,
.uil-whatsapp,
i[class*="whats"],
svg[class*="whats"],
a[href*="wa.me"],
a[href*="whatsapp"] {
  color: var(--whats-green) !important; /* ícone verde */
  fill: var(--whats-green) !important;
}

/* Número ao lado do ícone */
.header a[href*="wa.me"],
.header a[href*="whatsapp"],
.topbar a[href*="wa.me"],
.topbar a[href*="whatsapp"],
.navbar a[href*="wa.me"],
.navbar a[href*="whatsapp"],
.double-nav a[href*="wa.me"],
.double-nav a[href*="whatsapp"]{
  color: var(--eppi-primary) !important;  /* número em roxo */
  font-weight: 600;
}

/* Hover */
.topbar a[href*="whatsapp"]:hover,
.navbar a[href*="whatsapp"]:hover,
.double-nav a[href*="whatsapp"]:hover {
  color: var(--eppi-secondary) !important; /* laranja */
}

/* Se for imagem */
img[src*="whatsapp"] {
  filter: none !important;
  opacity: 1 !important;
}