/*
Theme Name: PF-2021
Theme URI:	https://softfocus.com.br/
Author: Rafael Forcadell
Version: 1.0
*/


/* 
Formulários
--------------------------------------------
*/


form {


	/* Fontes */

	--font-size: var(--h4-font-size);

}

input,
.input,
sf-input,
textarea,
select {
	display: block; 
	width: auto; 
	border: 0; 
	border-radius: 0;
	background: transparent; 
	color: var(--cor-cinza-medio); 
	font-family: var(--font-family); 
	font-size: var(--h4-font-size); 
	font-weight: var(--font-weight-regular); 
	line-height: 1.3em; 
	padding: 0; 
}

input,
sf-input,
textarea { cursor: text; }

sf-input { white-space: nowrap; }


label.checkbox { display: flex; font-size: var(--font-size); font-weight: var(--font-weight-regular); line-height: var(--line-height); text-transform: none; color: var(--cor-cinza-medio); margin: 0; padding: 0 0 0 30px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
label.checkbox input { position: absolute; z-index: -1; padding: 0; opacity: 0; }
label.checkbox .box { position: absolute; top: 3px; left: 0; width: 20px; height: 20px; background: transparent; border: 1px solid var(--cor-cinza-mais-claro); cursor: pointer; }
label.checkbox input:checked ~ .box {  }
label.checkbox .box:after { display: none; position: absolute; top: -9px; left: 10px; width: 7px; height: 21px; transform: rotate(45deg); -webkit-transform: rotate(45deg); border: solid var(--cor-cinza-medio); border-width: 0 2px 2px 0; content: ""; }
label.checkbox input:checked ~ .box:after { display: block; }
label.checkbox input ~ .box:before { position: absolute; top: 50%; left: 50%; width: 2px; height: 2px; margin: -1px; border-radius: 100%; background-color: rgba(0,0,0,.05); opacity: 0; content: ""; transition-property: width, height, margin; transition-duration: 100ms; transition-timing-function: ease-in-out; }
label.checkbox input:focus ~ .box:before { width: 60px; height: 60px; margin: -30px; opacity: 1; }


label.checkbox span.contagem { top: 2px; cursor: pointer; }


input:focus::placeholder,
textarea:focus::placeholder { color: transparent; }


[type=search],
[type=search]::-webkit-search-decoration,
[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-results-button,
[type=search]::-webkit-search-results-decoration { appearance: none; }


input.sem-setas::-webkit-outer-spin-button,
input.sem-setas::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number].sem-setas { -moz-appearance: textfield; }


[type=submit] { 
	font-family: var(--font-family); 
	font-size: var(--h6-font-size); 
	font-weight: var(--font-weight-semibold); 
	line-height: var(--line-height); 
	color: var(--cor-cinza-medio);
	text-transform: uppercase;
	border: 1px solid var(--cor-cinza-mais-claro); 
	border-radius: 30px;
	padding: 18px 30px;
	background-color: transparent;
	transition: all 100ms ease-in-out;
	transition-property: border-color, background-color;
}
[type=submit],
[type=submit] * { cursor: pointer; }
[type=submit]:hover,
[type=submit]:focus { background-color: var(--cor-secundaria); border-color:  var(--cor-secundaria); }

[type=submit].pequeno { width: 24px; height: 24px; padding: 0; background-color: var(--cor-primaria-media); border: 0; border-radius: 100%; }
[type=submit].pequeno:hover,
[type=submit].pequeno:focus { background-color: var(--cor-secundaria); }
[type=submit].pequeno:hover [style*="fill:"],
[type=submit].pequeno:focus [style*="fill:"] { fill: var(--cor-cinza-escuro) !important; }


