/* =============================
   Botões Genéricos - Base
============================= */

/* Botões */
button {
  background-color: #007bff;
  color: white;
  border: none;
  padding: 0.5rem 1rem;
  margin-bottom: 1rem;
  cursor: pointer;
  border-radius: 6px;
  font-size: 1rem;
  transition: background-color 0.3s ease;
}

button:hover {
  background-color: #0056b3;
}

.genric-btn,
.primary-btn {
  border: none;
  border-radius: 50px;
  color: #fff;
  font-size: 16px;
  padding: 10px 20px;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease, border 0.3s ease;
}

/* Tamanhos */
.genric-btn.e-large { line-height: 50px; padding: 0 40px; }
.genric-btn.large   { line-height: 45px; }
.genric-btn.medium  { line-height: 30px; }
.genric-btn.small   { line-height: 25px; }

/* Formatos */
.genric-btn.radius  { border-radius: 3px; }
.genric-btn.circle  { border-radius: 20px; }

/* Ícones */
.genric-btn.arrow {
  display: inline-flex;
  align-items: center;
}

/* Desabilitado */
.genric-btn.disable {
  background: #f9f9ff;
  color: rgba(34, 34, 34, 0.3);
  cursor: not-allowed;
  pointer-events: none;
}

/* =============================
   Temas de Botões
============================= */

/* Primary */
.genric-btn.primary,
.primary-btn {
  background: #62aeff;
  color: #fff;
}
.genric-btn.primary:hover,
.primary-btn:hover {
  background: #fff;
  color: #62aeff;
  border: 1px solid #62aeff;
}

/* Default */
.genric-btn.default,
.genric-btn.default-border:hover,
.genric-btn.link-border:hover {
  background: #f9f9ff;
  color: #222;
}

/* Success */
.genric-btn.success,
.genric-btn.success-border:hover {
  background: #4cd3e3;
}
.genric-btn.success:hover,
.genric-btn.success-border {
  background: #fff;
  color: #4cd3e3;
  border: 1px solid #4cd3e3;
}

/* Info */
.genric-btn.info,
.genric-btn.info-border:hover {
  background: #38a4ff;
}

/* Warning */
.genric-btn.warning,
.genric-btn.warning-border:hover {
  background: #f4e700;
}

/* Danger */
.genric-btn.danger,
.genric-btn.danger-border:hover {
  background: #f44a40;
}

/* Hover geral */
.genric-btn:hover {
  background: #0056b3;
}

/* =============================
   Botão Específico: .primary-btn
============================= */
.primary-btn {
  border-radius: 25px;
  font-weight: 500;
  line-height: 42px;
  padding: 0 30px;
  position: relative;
}
.primary-btn span {
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-60%);
  transition: right 0.3s ease;
}
.primary-btn:hover span {
  right: 20px;
}

/* =============================
   Botão Header
============================= */
.header-btn {
  background-color: #62aeff;
  border: 1px solid transparent;
  border-radius: 0;
  color: #fff;
  padding: 0 30px;
  cursor: pointer;
  transition: background 0.3s ease, border 0.3s ease;
}
.header-btn:hover {
  background: transparent;
  border: 1px solid #fff;
  color: #fff;
}

/* =============================
   Botões por Estado
============================= */
button.danger {
  background-color: rgba(255, 0, 0, 0.5);
}
button.danger:hover {
  background-color: #b32400;
}

button.waiting {
  background-color: rgba(255, 223, 51, 0.29);
}
button.waiting:hover {
  background-color: #e6c200;
}

button.warning {
  background-color: rgba(255, 121, 51, 0.29);
}
button.warning:hover {
  background-color: #e62400;
}

/* =============================
   Botões container-login
============================= */
.container-login button {
  background-color: #62aeff;
  border: none;
  border-radius: 5px;
  color: #fff;
  cursor: pointer;
  padding: 10px 20px;
  transition: background-color 0.3s ease;
}
.container-login button:hover {
  background-color: #2980b9;
}

/* =============================
   Botão Back To Top
============================= */
.back-to-top {
  background: #dd6855;
  border-radius: 50%;
  bottom: 15px;
  color: #fff;
  display: none;
  font-size: 16px;
  height: 44px;
  width: 44px;
  line-height: 1;
  position: fixed;
  right: 15px;
  text-align: center;
  transition: background 0.5s;
  z-index: 11;
  cursor: pointer;
}
.back-to-top i {
  padding-top: 12px;
}



/* =============================
   Botões em Tabelas
============================= */
td:first-child button {
  background-color: #62aeff;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
td:first-child button:hover {
  background-color: #368fe0;
}

/* =============================
   Outros botões e estilos
============================= */

/* Botão customizado - LightSlateGrey */
.btn-lightslategrey {
  background-color: #7899;
  border-color: #77889980;
  color: #fff;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.btn-lightslategrey:hover {
  background-color: #789c;
  border-color: #789c;
}

/* Remover outline em estados de foco */
.btn:focus,
.btn.active.focus,
.btn.active:focus,
.btn.focus:active,
.btn:active:focus {
  outline: 0;
  text-decoration: none;
}



/* =============================
   Botões em projetos e links
============================= */
.projects-list .primary-btn {
  border: 1px solid transparent;
  border-radius: 0;
}


/* =============================
   Botões e Inputs - Bordas arredondadas
============================= */
button {
  border-radius: 5px;
}