.titl{
  height:275px;
  width:100%;
  display:flex;
}
.div1{
  height:100%;
  width:100%;
  background:linear-gradient(#CCCCCC, #000000);
  text-align: center;
  border: 6px solid black;
}
.logo{
  height:100%;
  width:30%;
}
.h11{
  font-size:8vw;
  max-width: 100%;
  color:white;
}

.footer{
  height:100px;
  width:100%;
  background:linear-gradient(#CCCCCC, #000000);
  text-align:center;
  line-height:100px;
  border: 2px solid grey;
}
.p1{
  color:white;
}
.divprincipal{
  height:530px;
  width:100%;
  display:flex;
  border: solid 6px black;
  background:#0a0a0a;
}
.menu {
  height:50px;
  width: 100%;
  text-align: center;
  border: solid 3px black;
  display: flex;
}

.opt1 {
  flex: 1;
  width: 100%;
  background:linear-gradient(#CCCCCC, #000000);
  color: white;
  text-align: center;
  border: solid 6px black;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer; /* Adiciona cursor de mão */
}

.opt1:hover {
  background: #CCCCCC; /* Efeito hover */
}

.painel{
  height:100%;
  width:100%;
  text-align:center;
  border: solid 3px black;
  background: #0a0a0a; /* Fundo escuro */
}

.escondido {
  display: none;
}

/* Estilo para as divs que não estão escondidas */
#itemsistm, #itemcadasprod, #itemclient, #itemdecont, #itemhistoric {
  background: #0a0a0a;
  padding: 20px;
  border-radius: 8px;
  border: 4px solid #00ff00;
  margin-bottom: 20px;
  overflow-y: auto;
  height: 100%;
  box-sizing: border-box;
}

.part1{
  width:100%;
  display:flex;
  gap:20px;
  justify-content:center;
  align-items:center;
  flex-wrap: wrap; /* Para responsividade */
}

.part2{
  width:100%;
  display:flex;
  gap:20px;
  justify-content:center;
  align-items:center;
  flex-wrap: wrap;
}

.part3{
  width:100%;
  text-align:center;
}

.Espc{
  height:40px;
}

.btnconf{
  background:#00ff00;
  color:black;
  border-radius:8px;
  padding: 10px 20px;
  cursor: pointer;
  font-weight: bold;
  border: none;
}

.btnconf:hover {
  background: #00cc00;
  transform: scale(1.02);
}

.imgicon {
  height:40px;
  width: 100%;
  background: white;
  color: #00ff00;
  border-width: 1px;
  border-style: solid;
  border-color:#00ff00;
}

.btnfile{
  background: #00ff00;
  height:25px;
}

.logoimg{
  width:100%;
  height:100%;
}

#RESPCDS, #RESPSLVNT {
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
  word-wrap: break-word;
  white-space: normal;
  padding: 10px;
  margin-top: 15px;
  background-color: #1a1a1a;
  border-radius: 5px;
  font-size: 14px;
  color: #00ff00;
}

#RESPCDS::-webkit-scrollbar,
#RESPSLVNT::-webkit-scrollbar {
  width: 8px;
}

#RESPCDS::-webkit-scrollbar-track,
#RESPSLVNT::-webkit-scrollbar-track {
  background: #333;
  border-radius: 10px;
}

#RESPCDS::-webkit-scrollbar-thumb,
#RESPSLVNT::-webkit-scrollbar-thumb {
  background: #00ff00;
  border-radius: 10px;
}

.hcolor {
  color:#00ff00;
}

.placolor {
  background:#292929;
  box-shadow: 0 0 5px #00ff00;
  color:#00ff00;
  padding: 8px;
  border-radius: 5px;
  border: 1px solid #00ff00;
}

.placolor::placeholder {
  color:#00ff00;
  opacity: 0.7;
}

input, button {
  font-size: 16px;
}

/* Garante que o painel principal aparece */
#itemsistm {
  display: block !important;
}




.Listaprod{
}