:root {
  --main-background: #0D0D0D;
  --secondary-background: #1a1a1a;
  --panel-background: #2a2a2a;
  --heading-text : #e0e0e0;
  --secondary-head-text: #a0a0a0;
  --secondary-text: #a2a2a2;
  --primary-border:#c4c4c4;
  --primary-accent: #F72585;
  --secondary-accent:#a930c1;
  --tertiary-accent:#3e2dad;
}


/* width */
::-webkit-scrollbar {
  width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 2px #2a2a2a;
  border-radius: 2px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #2a2a2a; 
  border-radius: 20px
  ;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--secondary-accent); 
}
html{
    height: 100%;
}

body{
    font-family: "Poppins" !important;
    margin: 0;
    background:var(--main-background)!important;
    min-height: 100%;
}

a
{
  text-decoration: none!important;
}


h2,h3, .container-date, .card-title, .log-head, .dt-search{
  margin: auto;
    color: var(--heading-text)!important;
}

h4,.header-line, th, .log-col, td
{
    color: var(--secondary-head-text)!important;
}


.head-wrap{
  display: flex;
  margin: 10px 0;
  align-items: center;
  height: 40px;
}

.header {
  /* padding: 0 10px; */
  margin: 20px 20px 0px 20px;
  background: transparent;
  border-bottom: solid var(--primary-border);
  min-width: max-content;
}
.header-line{
  margin: 0;
  height: 100%;
  margin-top: 0;
}

fieldset
{
  border-color: var(--primary-border);
  /* background: #edebe940; */
  border-radius: 5px;
  margin: auto;
  /* background: #FFFFFF; */
  color: var(--secondary-head-text);
  border-radius: 8px;
}

.form-element
{
    display: block;
    width: 100%;
    border-radius: 4px;
    border-color: var(--primary-border);
    margin: 4px auto;
}

.form-element input
{
  background:var(--panel-background);
  color: var(--secondary-text);
}


 input[type="text"]{
    background-color: var(--panel-background)!important;
    color: --secondary-text;
    margin: 4px auto;
    margin: 8px 0 ;
    min-height: 36px;
    padding: 4px;
}

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 10px;
  border: 1px solid #888;
  width: 80%;
}