/* ---------------------------------------------------------------------------------------------------------------------------- */
/* Elementos para o componente Gridster */
/* ---------------------------------------------------------------------------------------------------------------------------- */

.gridster .gs-w {
	list-style: none;
}

.gridster>ul{
	padding-left: 0;
	padding-right: 0;
	/*min-width: 800px !important;*/
}

.gridster-header>h1{
	font-size: 1.15em;
}

.gridster>ul>li{
	display: block!important;
	box-shadow: rgba(0,0,0,0.2) 0px 0px 10px;
	border: 0;
	border-radius: 8px;
	/*background-color: #FFF;*/
	padding: 0;
	margin-bottom: 0.2vh;
}

.gridster>ul>li>div{
	border: 0;
	text-align: center;
	border-radius: 8px;
	padding-left: 3px;
	padding-right: 3px;
}

.gridster>ul>li>div.last{
	display: table;
	width: 100%;
}

.gridster>ul>li.clicable>div{
	cursor: pointer;
}

.gridster>ul>li.with-header>div{
	height: 92%;
}

.gridster>ul>li>header.without-header, .gridster>ul>li>p.without-header, .gridster>ul>li>div.last + span {
	display: none;
}

.gridster>ul>li.clicable>div :hover{
	/*background-color: #F3F3F3;*/
	border-radius: 8px;
}

.gridster>ul>li.clicable>div>span.glyphicon-unico{
	font-size:4em;
	display: table-cell;
	vertical-align: middle;
	color: #337ab7;
}

.gridster>ul>li>header, .gridster>ul>li>p {
	padding: 1px;
	/*color: #337ab7;
	font-weight: bold;*/
	border-bottom-style: solid;
	border-bottom-color: #337ab7;
	border-bottom-width: 1px;
	background-color: transparent;
	height:23px;
	margin:0;
}

.gridster>ul>li>header{
	cursor: move;
}

.gridster>ul>li>header.text-left>span, .gridster>ul>li>header.text-right>span, .gridster>ul>li>p.text-left>span, .gridster>ul>li>p.text-right>span{
	margin-top: 3px;
}

@media (max-width: 800px) {
	
	.gs-resize-handle{
		display: none;
	}
}

.gridster-with-header>div>p {
	font-size: 1.15em;
	margin: 0;
}

.cardorion>div:not (.CardHorizontal){
	height: 100%;
	padding-left: 10%!important;
	padding-right: 10%!important;
}

.cardorion>div {
	margin-bottom: 0px;
}

.card-indicador-txt h5 {
	font-size: 1.1em;
	font-weight: 400;
}

.card-indicador-txt p {
	font-size: 1.7em;
	font-weight: 700;
}

.card-indicador-txt span {
	font-size: 1.1em;
	font-weight: 700;
}

.card-indicador-txt {
	border: none!important;
	box-shadow: none!important;
	padding: 0px 20px 0px 20px!important;
}

.card-indicador-txt>div {
	border-left: 1px solid!important;
	border-right: 1px solid!important;
	border-bottom: 1px solid!important;
	border-top: 1px solid!important;
	padding-left: 15px!important;
	padding-right: 15px!important;
	padding-top: 5px;
	padding-bottom: 0px;
}

.card-indicador-txt>div>.panel-body {
	padding: 0px;
}

.gridcard-indicador-txt>div>ul {
	border: 1px solid!important;
	border-radius: 8px!important;
}

/* No header já tem a opção de alinhar o texto. No ocrm foi movido para css próprio 
.gridcard-indicador-txt>.gridster-header {
	float: left;
}
*/
.card-indicador-txt-negativo p {
	color: orangered!important;
}

.CardHorizontalItem {
	width: inherit!important;
	height: 100px!important;
    border-top-style: dashed!important;	
	margin-bottom: 0.5px!important;
}

.CardHorizontal {
	/*--float: left;	*/
	padding-left: 0%!important;
    padding-right: 0%!important;
}

.CarddivImagem {
	height: inherit;
}

.CarddivImagem:not(.CardHorizontal) {
	min-height: 16vh;
    height: 16vh;
	/*min-width: 200px;*/
	width: auto;
    vertical-align: middle;
	padding-top: inherit
}

.CardProdImagem {
	display: inline;
	max-height: 100%;
}

.CardProdQuant {
	width: 5%;
}

.CardProdPreco {
	min-width: 20%;
}

.CardProdImagemHorizontal:not(.CardProdImagemMobile) {
	width: 55px!important;
	margin-top: 10px!important;
}

.CardProdNome {
	height: 8.5vh;
}

.CardProdIndisponivel {
	text-decoration: line-through; 
	color: red;
}

.panel-body>.cardImagem:not(.CardHorizontal) {
	height: 190px;
	width: auto;
	display: inline;
}

.panel-body>.cardTextRegion {
	height: 40px;
	line-height: 40px;
	vertical-align: middle;
}

.panel-body>h5 {
	font-weight: inherit;
}

/* Configurações do Card para produtos */
.cardDescCompl p, .CardComplBodyRegion, .CardProdPreco p {
	font-weight: bold!important;
}

.CardProdNomeHorizontal>h5 {
	font-size: 1.2em;
}
.CardProdPrecoHorizontal>p {
	margin-bottom: 1px;	
	font-size: 1.5em;
}

.CardProdPrecoHorizontal>p, .CardProdPrecoHorizontal>span {
	text-align: right;
}

.CardProdPreco>span {
	font-weight: bold!important;
    font-size: 10px;
}
	
.CardProdNomeHorizontal {
	text-align: left;
	height: 70px;
	--padding-top: 25px;
}

.CardProdQuantHorizontal, .CardProdPrecoHorizontal {
	text-align: right!important;
	padding-top: 15px;	
}

.TxtObsProd {
	overflow-x: hidden;
	--text-align: left!important;
}

.ObsProd {
	text-align: left!important;
	overflow-x: hidden;
}

.ProdPrecoRiscado {
	text-decoration: line-through; 
	font-size: 0.7em
}

.tagProdPromocao {
	font-size: 1.2em;
    color: red;
	display: block;
    float: right;
    margin-top: -6px;
}

/* Refinios de configurações por resolução */

 /* Ajustes para desktop */
@media (min-width: 768px) {
	.CardProdQuant, .CardProdPrecoHorizontal {
		height: 70px;	
	}	
}

/* Ajuste para mobile */

@media (max-width: 767px) {	

	.CardHorizontalItem {	
		height: 125px!important;
	}	
		
	.CardHorizontal {
		padding: 0px;	
		-height: auto;
		text-align: center;
	}

	.CardProdNome:not(.CardProdNomeMobile) {
		font-size: 18px;
		width: 85px;
	}
	
	.CardProdNomeMobile {
		width: 83.33333333%!important;
		padding-top: 2px!important;
		height: 55px!important;
		margin-top: 5px;
	}

	.CardProdQuant .panel-text  {
		font-size: medium;
		text-align: left;
		margin-left: 25px;
	}	
	
	.CardAcoesProd {
		width: 90px;	
	}
	
	.CardAcoesProdMobile {
		padding-top: unset;
		width: 110px;
	}
	
	.CardProdPrecoMobile{
		float: right;
		margin-right: 20px;
	}
	
	.CardAcoesProdMobile>button {
		padding: 4px 10px;
		font-size: 16px!important;
	}
	
	.CardProdQuantMobile, .CardProdPrecoMobile {
		width: unset;
		padding-top: unset!important;
	}
	
	.CardHorizontal>.panel-body {
		height: inherit;
	}
	
	.CardProdImagemMobile {
		width: 55px!important;
		height: 55px!important;
		margin-top: 35px!important;
	}
	
	.DadosObsProd {
		float: right;
		margin-top: 47px;
		margin-right: 50px;
	}
	
	.CardProdPrecoHorizontal>p {
		font-size: 18px!important;
	}
	
	.CardProdPrecoHorizontal>span {
		font-size: 12px!important;
	}
}

/* Ajustes finos de configurações por resolução */

@media (max-width: 968px) and (min-width: 768px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 70px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 80px!important;
	}	
	
	.CardProdPrecoHorizontal>.panel-text:not(.CardProdPrecoMobile), .CardProdQuantHorizontal>.panel-text:not(.CardProdQuantMobile) {
		font-size: 14px;
	}	
		
	.CardProdPrecoHorizontal p {
		font-size: 10px!important;
	}			
	
	.CardProdPrecoHorizontal span {
		font-size: 10px!important;
	}			
}

@media (max-width: 1167px) and (min-width: 968px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 85px;
	}	
	
	.CardProdPrecoHorizontal>.panel-text:not(.CardProdPrecoMobile), .CardProdQuantHorizontal>.panel-text:not(.CardProdQuantMobile) {
		font-size: 17px;
	}	

	.CardProdPrecoHorizontal p {
		font-size: 16px!important;
	}			
	
	.CardProdPrecoHorizontal span {
		font-size: 8px!important;
	}	

	.CardAcoesProdHorizontal {
		width: 26%;
	}
}

@media (max-width: 1230px) and (min-width: 1167px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 100px;
	}	
	
/*@media (max-width: 1200px) {*/
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 85px;
	}
	
	.CardProdNomeHorizontal>.panel-title:not(.CardProdNomeMobile) {
		font-size: 14px;
	}
	
	.CardProdPrecoHorizontal>.panel-text:not(.CardProdPrecoMobile), .CardProdQuantHorizontal>.panel-text:not(.CardProdQuantMobile) {
		font-size: 18px;
	}

	.CardProdPrecoHorizontal>span {
		font-size: 10px!important;
	}	
}

@media (max-width: 1200px) and (min-width: 768px) {

	.CardAcoesProdInput {
		font-size: 9px!important;
	}
}

@media (max-width: 1366px) and (min-width: 1230px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 120px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 100px!important;
	}	
}

@media (max-width: 1450px) and (min-width: 1366px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 140px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 100px!important;
	}	
}

@media (max-width: 1600px) and (min-width: 1450px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 160px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 100px!important;
	}	
}

@media (max-width: 1700px) and (min-width: 1600px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 190px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 100px!important;
	}	
}

@media (max-width: 1900px) and (min-width: 1700px) {
	
	.CardProdNomeHorizontal:not(.CardProdNomeMobile) {
		max-width: 210px;
	}	
	
	.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
		min-width: 100px!important;
	}	
}

.CardAcoesProdHorizontal:not(.CardAcoesProdMobile) {
	height: 70px;
	padding-top: 20px;
}

.CardAcoesProd:not(.CardAcoesProdHorizontal) {
	margin-top: 14px;
}

.CardAcoesProdInput {
	text-align: center;
	font-weight: bold;
	padding-left: 1px;
    padding-right: 1px;
}

.CardAcoesProdLink {
	padding: 5px;
}

.CardProdNomeHorizontal>h5 {
	height: 85%;
	overflow-y: hidden;
}

.CardAcaoObsProd {
	text-align: left;
	overflow-y: hidden;
	padding-top: 1px;
}

.panel-body>.cardTextRegion>h5, .CardProdNome>h5 {
	font-weight: inherit;
	display:inline-block;
	vertical-align: middle;
}

.CardProdNome:not(.CardProdNomeHorizontal)>h5 {
    height: 100%;
	font-size: 15px;
	overflow-y: hidden;	
}

/* Grid de produtos */
.GridCardProd {
	display: grid;
    grid-template-columns: repeat(auto-fill,minmax(180px,1fr));
    grid-gap: 0.5rem;
    margin: 0;
	padding-top: 1vh;
}

.GridCardProdHorizontal {
	grid-template-columns: repeat(auto-fill,minmax(252px,768px));	
}

/* ajuste necessário para edge */
.GridCardProd>li {
	height: 100%;
}

.divLoaderRefreshGridCardProd {
	display: inline-flex;
	text-align: center;
}

.divLoaderRefreshGridCardProd>.divLoaderRefreshProd {
	height: 16vh;
}

.CarddivImagemProg:not(.CardHorizontal) {
	height: 36vh!important;
	padding-top: 10vh;
}

.divLoaderRefreshProd {
    width: 100%;
    height: 220px;
	padding-top: 10px;
}

.CardHorizontal>.divLoaderRefreshProd {
    height: 55px;
	padding-top: 1px;	
}

.loaderRefreshProd {
    border: 5px solid #f3f3f3; /* Light grey */
    border-top: 5px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 100px;
    height: 100px;	
    animation: spinProd 2s linear infinite;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 0px;
	display: inline-block;
}

.CardHorizontal>.divLoaderRefreshProd>.loaderRefreshProd {
    width: 65px;
    height: 65px;	
}

@media (max-width: 767px) {

	.CardHorizontal>.divLoaderRefreshProd {
		height: 70px;
		width: 70px;
	}
	
	.CardHorizontal>.divLoaderRefreshProd>.loaderRefreshProd {
		width: 45px;
		height: 45px;	
	}
}

@keyframes spinProd {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}