/*
 * Jogo AI (api.jogoai.app)
 * Copyright © 2024 Lunabash (Pty) Ltd. All Rights Reserved
 * Unauthorised copying of this file, via any medium is strictly prohibited
 * Proprietary and confidential
 * style.php 27-06-2024, 12:51:00
 */

@font-face {
  font-family: "Poppins-Reg";
  src: url("../font/Poppins/Poppins-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Poppins-Light";
  src: url("../font/Poppins/Poppins-Light.ttf") format("truetype");
}

@font-face {
  font-family: "Poppins-Medium";
  src: url("../font/Poppins/Poppins-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Poppins-Bold";
  src: url("../font/Poppins/Poppins-Bold.ttf") format("truetype");
}

:root {
  --background: #f2f2f2;
  --chartreuse: #8bff00;
  --jet: #2e2e2e;
  --white: #ffffff;
  --darkorange: #ff8b00;
  --dodgerblue: #008BFF;
  --magenta: #FF008B;
  --springgreen: #00FF8B;
  --green: #00FF00;
  --tangelo: #FF4500;
}

body,
html {
  font-family: "Poppins-Reg";
  height: 100%;
  background-color: var(--background);
}
p {
  font-family: "Poppins-Reg";
  color: var(--jet);
}
b {
  font-family: "Poppins-Bold";
  color: var(--jet);
}
a,
a:hover {
  font-family: "Poppins-Reg";
  color: var(--jet);
  text-decoration: none;
}
footer {
  height: 5vh;
}
caption {
  font-family: "Poppins-Reg";
  font-size: 15px;
}
table {
  font-family: "Poppins-Reg";
  font-size: 15px;
}
.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
  background-color: rgba(11, 34, 62, 0.4);
}
/* tfoot {
    background-color: rgba(0, 125, 177, 0.3);
  } */
.grecaptcha-badge {
  visibility: hidden;
}
.container {
  height: 100vh;
  padding: 25px;
}
.content {
  height: 90vh;
}
.card {
  background-color: var(--white) !important;
  border: 0px;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.login_logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 60%;
  object-fit: scale-down;
}
.powered_by {
  display: inline;
  margin-left: auto;
  margin-right: auto;
  width: 10%;
}
.form-control {
  background: var(--white);
  border-radius: 5px;
}
.form-control:focus {
  border-color: var(--chartreuse);
  box-shadow: none !important;
}
.form-select {
  border-radius: 5px;
}
.form-select:focus {
  border-color: var(--chartreuse);
  box-shadow: none !important;
}
.form-label {
  height: 5px;
  margin-bottom: 0px;
}
.help-lable {
  font-family: "Poppins-Reg";
  color: #f94144;
  text-align: center;
}
.btn-primary {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
}
.btn-primary:hover {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
}
.bg-primary {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
}
.bg-success {
  background-color: var(--chartreuse) !important;
}
.bg-secondary {
  background-color: var(--chartreuse) !important;
}
.btn-outline-primary {
  border-color: var(--chartreuse);
  color: var(--chartreuse);
  border-radius: 25px;
}
.btn-outline-primary:hover {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
  color: var(--white);
  border-radius: 25px;
}
.btn-outline-primary:active {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
  color: var(--white);
  border-radius: 25px;
}
.btn-outline-primary:focus {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
  color: var(--white);
  border-radius: 25px;
}
.btn-outline-primary .show > .btn-primary.dropdown-toggle {
  background-color: var(--chartreuse);
  border-color: var(--chartreuse);
  color: var(--white);
  border-radius: 25px;
}
.btn-outline-secondary {
  border: var(--bs-border-width) solid var(--bs-border-color);
}
.btn-outline-secondary:hover {
  border-color: var(--chartreuse);
  color: var(--jet);
  background-color: var(--chartreuse);
}
.footer-text {
  color: var(--jet);
}
#formResetButton {
  font-family: "Poppins-Reg";
  text-align: center;
  color: var(--white);
  background: var(--jet);
}
#formResetButton:hover {
  background: var(--chartreuse);
  color: var(--jet);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1)
}
#formLoginButton {
  font-family: "Poppins-Reg";
  text-align: center;
  color: var(--white);
  background: var(--jet);
}
#formLoginButton:hover {
  background: var(--chartreuse);
  color: var(--jet);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1)
}
.navbar {
  background-color: var(--white);
  box-shadow: inset 0 0 15px rgba(55, 84, 170, 0),
    inset 0 0 20px rgba(255, 255, 255, 0), 7px 7px 15px rgba(55, 84, 170, 0.15),
    -7px -7px 20px rgba(255, 255, 255, 1),
    inset 0px 0px 4px rgba(255, 255, 255, 0.2);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#profile_notification {
  width: 40px;
  height: 40px;
  border-radius: 200px;
}
.nav-pills .nav-link.active {
  background-color: var(--oxford_blue);
  color: var(--white);
}
.nav-pills .nav-link {
  color: var(--oxford_blue);
}
.nav-tabs .nav-link.active {
  background-color: var(--chartreuse);
  color: var(--jet);
}
.nav-tabs .nav-link {
  color: var(--oxford_blue);
}
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
#profile_picture {
  width: 40px;
  height: 40px;
  border-radius: 150px;
  object-fit: cover;
}
#plant_picture {
  width: 150px;
  height: 150px;
  border-radius: 25px;
  object-fit: cover;
}
.profile_container {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 150px;
  height: 150px;
  border-radius: 150px;
}
.profile_image {
  display: block;
  width: 150px;
  height: 150px;
  border-radius: 150px;
  object-fit: cover;
}
.profile_overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 150px;
  height: 150px;
  border-radius: 150px;
  opacity: 0;
  transition: 0.5s ease;
  background-color: var(--oxford_blue);
}
.profile_container:hover .profile_overlay {
  opacity: 0.8;
}
.profile_text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.list-group {
  background-color: transparent;
}
td {
  color: var(--jet);
  font-family: "Poppins-Reg";
  vertical-align: middle;
  text-align: center;
}
th {
  color: var(--jet);
  font-family: "Poppins-Reg";
  vertical-align: middle;
  text-align: center;
}
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: rgba(139, 255, 0, 0.5);
}
.text-bg-primary {
  font-family: "poppins-Reg";
  color: var(--jet) !important;
  background-color: var(--chartreuse) !important;
}
.text-bg-success {
  font-family: "poppins-Reg";
  color: var(--jet) !important;
  background-color: var(--springgreen) !important;
}
.text-bg-secondary {
  font-family: "poppins-Reg";
  color: var(--background) !important;
  background-color: var(--dodgerblue) !important;
}
.text-bg-warning {
  font-family: "poppins-Reg";
  color: var(--jet) !important;
  background-color: var(--darkorange) !important;
}
.text-bg-danger {
  font-family: "poppins-Reg";
  color: var(--jet) !important;
  background-color: var(--tangelo) !important;
}