.POSActivedBtn{
  border:solid red 1px;
  color:red;
  background:none;
}
.mouvementStock{
  border-collapse:collapse;
  width:100%
}
.mouvementStock thead{
  position:sticky;
  top:0;
  border-bottom:solid grey 1px;
  background:white;
}
.mouvementStock tbody tr{
  border-bottom:solid lightgrey 1px;
}
.mouvementStock th,.mouvementStock td{
  padding:7px;
  text-align:left;
}
.mouvementStock td:nth-child(1){
  width:170px;
  vertical-align: top;
}
.mouvementStock td:nth-child(2){
  width:300px;
}
.mouvementStock td:nth-child(3),.mouvementStock td:nth-child(4),
.mouvementStock th:nth-child(3),.mouvementStock th:nth-child(4){
  width:75px;
  text-align:center;
}
.mouvementStock td:nth-child(5){
  width:200px;
  vertical-align: top;
}
.mouvementStock td:nth-child(6){
  width:170px;
  vertical-align: top;
}
.mouvementStock td:nth-child(7){
  vertical-align: top;
}
.product{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto 1fr;
  width:fit-content;
}
.product img{
  width:75px;
  height:75px;
  grid-row:1/4;
}
@font-face {
  font-family: 'DIGITALED';
  font-style: normal;
  font-weight: 400;
  src: url('http://localhost:91/stylepolice/DIGITALED.woff') format("woff");
}
.POS{
  display:grid;
  grid-template-columns:376px calc(100% - 376px);
  grid-template-rows:auto 1fr;
  max-height:calc(100% - 5px)
}
.Config{
  display: grid;
  width: 100%;
  grid-template-columns: auto 1fr;
  grid-gap:3px;
}
.Config button{
  width:150px;
  border:none;
  padding:5px;
  box-shadow:0 0 5px grey;
}
.Config button:nth-child(1){
  grid-row-start:1;
  grid-row-end:2;
  font-weight:bold;
  font-size:30px;
}
.Config button:nth-last-child(1){
  display:grid;
  grid-template-columns:1fr auto;
  width:100%;
  padding:10px;
}
#ventes{
  grid-row-start:1;
  grid-row-end:3;
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:auto 1fr auto;
  max-height:100%;
  height:100%;
}
#ventes > div{
  margin: 5px;
  padding: 5px;
  box-shadow: 0 0 5px black;
}
#Poscaisse{
  background:#4082e6;
  box-shadow:0 0 5px black inset;
  border:none;
  border-radius:15px;
  width:360px;
}
#Poscaisse label{
  color:lightblue;
}
.goodCard{
  background: #024242;
  padding: 5px;
  color: lightblue;
  margin-top:5px;
}
.retourCard{
  background: #440101;
  padding: 5px;
  color: pink;
  margin-top:5px;
}
.creditView{
  cursor:pointer;
}
.creditView:hover{
  color:darkcyan
}
.hoveredLine{
  cursor:pointer;
  transition:background .5s;
}
.hoveredLine a{
  color:#4082e6;
  text-decoration:none;
}
.hoveredLine:hover{
  background:lightgrey;
}
summary{
  background:#d7dfe8
}
summary th{
  color:#4082e6
}
.failCard{
  background: pink;
  padding: 5px;
  color: red;
  margin-top:5px;
}
#ventes > div > div button{
  float: right;
  margin-top: -4px;
  margin-right: -4px;
  background: transparent;
  border: none;
  color: coral;
  cursor: pointer;
}
#TotalView{
  background:black;
  color:lime;
  font-size:30px;
  text-align:center;
  text-shadow:0 0 5px black;
  box-shadow:0 0 5px black;
  padding:15px;
  font-weight:bold;
}
#navy{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  grid-gap:5px;
  background:#d7dfe8;
}
#navy > div{
  padding:5px;
}
#frame sup{
  color:red;
  font-weight:bold;
  font-size:14px;
}
#frame{
  display:flex;
  flex-direction:row;
  width:fit-content;
}
#frame button{
  width:100%;
}
#parentFrame{
  overflow-x:hidden;
  width:404px;
}
#ClientFrame{
  display:grid;
  grid-template-columns:auto auto 1fr auto;
}
#ProfileImg{
  width:2rem;
  height:2rem;
  border-radius:50% 50% 0 0;
  box-shadow:0 0 5px black;
  float:right;
  margin-top:2px;
}
#notifications{
  margin-right:20px;
  border-right:solid grey 2px;
  padding:5px;
  float:right;
}
#notifications sup,.notification,.succes{
  background: red;
  padding: 0;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 10px;
  color: white;
  font-weight: bold;
  border-radius: 3px;
  margin-left: -7px;
  box-shadow:0 0 5px coral;
}
.succes{
  background:green;
  box-shadow:0 0 5px lightgreen;
  margin-left:0px
}
.profileView{
    height:0;
    background:white;
    border:none;
    border-left:solid #4082e6 3px;
    border-radius:7px 0 0 7px;
    width:150px;
    overflow:hidden;
    transition:height .5s;
    z-index:4;
    position:absolute;
    box-shadow:0 0 5px black;
}
.profileView button{
    background:transparent;
    border:none;
    width:100%;
    padding:5px;
    cursor:pointer;
    transition:background .5s;
    text-align:left;
    padding-left:7px;
}
.profileView button:disabled{
    color:grey;
}
.profileView button:disabled:hover{
    background:white;
}
.profileView button:hover{
    background:#4082e6;
}
.searchBtn{
    width: fit-content;
    border: solid white 1px;
    border-radius: 0 10px 10px 0;
    background:#4082e6;
    box-shadow: 5px 2px 5px black;
    color:white;
    padding: 5px;
    padding-top: 7px;
}
.searchBar{
    padding: 5px;
    border-radius: 0;
    border: solid #4082e6 1px;
    padding-top: 7px;
    padding-right: 25px;
    background: transparent;
    width: 180px;
    color: #4082e6;
}
.Marks{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-gap:5px;
    width:fit-content;
}
.Marks div{
    padding:5px;
    border:solid white 1px;
}
