/*
html{
 zoom: 100%;  uwaga psuje cien offcanvas 
}
*/

:root {
  --tblr-body-font-size: 0.9rem;

}

/*links*/

a {
  color: #1c092c;
  text-decoration: none;
  
}
a:hover {
  color: #1c092c;
  /* text-decoration: underline; */
  /* font-weight: bold; */
  text-decoration: none;
  
 
  
}

.theme-dark a {
  color: #d9d4de;
  text-decoration: none;
}
.theme-dark a:hover {
  color: #d9d4de;
  /* font-weight: bold; */
  text-decoration: none;
  
  /* text-decoration: underline; */
}



.theme-dark .navbar-brand-autodark {
    filter: brightness(2) invert(0);
  }

  .theme-dark .logo-xbox {
    filter: invert(1); 

  }

  .theme-dark .logo-playstation {
    filter: invert(1); 

  }

  .theme-dark .logo-steam {
    filter: invert(1); 

  }

  .theme-dark .logo-invert {
    filter: invert(1); 

  }

/*   
a {
    color:  #120047c9;
    text-decoration: none;
}

a:hover {
  color: #120047c9;
  text-decoration: underline;
}

.theme-dark a {
  color:  #9963b4 ;
  text-decoration: none;
}


.theme-dark a:hover {
  color:  #9963b4 ;
  text-decoration: underline;
}

 */

  .dropdown-menu {
    box-shadow: 20px 2rem 1rem rgba(36, 35, 35, 0.15);
   
  }

  .theme-dark .dropdown-menu {
   
    box-shadow: 20px 2rem 1rem #afafaf2d;

  }
 
  .theme-dark .dataTables_filter
  {
    color: red;
  }


  /* datatables  */

  .theme-dark .dataTables_wrapper .dataTables_filter {
    float: right;
    text-align: left;
    color: white;
  }
  .theme-dark .dataTables_wrapper .dataTables_filter input {
    border: 1px solid #aaa;
    border-radius: 3px;
    padding: 5px;
    background-color: transparent;
    
    margin-left: 3px;
  }


  .bg-tt {
    color: var(--tblr-primary) !important;
    background-color: rgb(5, 2, 22) !important;
  }
  
  /* tooltips  */

  .tooltip-inner {
    max-width: 100% !important;
}

.theme-dark .tooltip-inner {
  
  background-color: white;
  color: black;
  border: 1px solid;
  
}

.h1 a,
.h2 a,
.h3 a,
.h4 a,
.h5 a,
.h6 a,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: whitesmoke;
}
.h1 a:hover,
.h2 a:hover,
.h3 a:hover,
.h4 a:hover,
.h5 a:hover,
.h6 a:hover,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
  color: whitesmoke;
}

/*.card {
  --tblr-card-spacer-y: -1rem;
  --tblr-card-spacer-x: 1rem;
  --tblr-card-title-spacer-y: 1rem;
}*/

overlay-div { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100px; /* Adjust the height as needed */ 
  background-color: #f00; /* Set the background color of the overlapping div */ 
  z-index: 999; /* Set a high z-index value to ensure the div appears on top */ 
} 

/* searchbox*/
.offcanvas.offcanvas-top {
 top: 160px!important;
}



.img-fluid {
  max-width: 100%;
  max-height: 50%;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;


}


.img-fluid-ps {
  max-width: 60%;
  height: 30px;

  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  transform: scaleX(1.6);


}


/*
.img-fluid-ps:hover {
  transform: scale(20);  (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) 
  transition: transform .5s;
  translate: 300px;
  z-index: 100;
  
}


.img-fluid-st:hover {
  transform: scale(15); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) 
  transition: transform .5s;
  translate: 300px;
  z-index: 100;
}
*/

/* Datatables jquery*/

table.dataTable.compact tbody th,
table.dataTable.compact tbody td {
  padding: 2px;
}


/* image crop for datatables */

.tt-center-cropped-img {
  /*width: 100px;
  height: 100px;*/
  background-size: cover;background-repeat: no-repeat;background-position: center center;
}



/* datatables selected row */

table.dataTable tbody tr.selected > * {
  box-shadow: inset 0 0 0 9999px rgba(105, 75, 188, 0.712); /* TT */
  color: white;
}
table.dataTable.stripe > tbody > tr.odd.selected > *,
table.dataTable.display > tbody > tr.odd.selected > * {
  box-shadow: inset 0 0 0 9999px rgba(105, 75, 188, 0.712); /* TT */
}
table.dataTable.hover > tbody > tr:hover > *,
table.dataTable.display > tbody > tr:hover > * {
  box-shadow: inset 0 0 0 9999px rgba(105, 75, 188, 0.712); /* TT */
  color: white;/* TT */
}
table.dataTable.hover > tbody > tr.selected:hover > *,
table.dataTable.display > tbody > tr.selected:hover > * {
  box-shadow: inset 0 0 0 9999px rgba(105, 75, 188, 0.712); /* TT */
}


table.dataTable tbody a.selected > * {
  box-shadow: inset 0 0 0 9999px rgba(105, 75, 188, 0.712); /* TT */
  color: white;
}


.przesloniecie
{
  position: absolute;
  justify-content: center; 
  right: 0px; 
  top: 0px ;
  height:300px; 
  z-index: 99; 
}