@import "./vars.css";
@import "./reset.css";
@import "./font.css";
@import "./btn.css";
@import "./menu-side.css";
@import "./alert.css";
@import "./bread.css";
@import "./box.css";

/*
body{background-repeat: no-repeat;background-position: center center; background-size: cover;background-image: url('/assets/img/bg-login.jpg');}

*/

body{background: gray;}
/*
	GRID AREA: linha inicial, coluna inicial, expansao linha (vertical), expansao coluna (horizontal)
*/

#app{min-height: 100vh; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 60px 1fr 60px; gap: 0; display: grid;transition: 0.4s;}
#app.mini{grid-template-columns: 30px 1fr 30px ;transition: 0.4s;}


main{grid-area: 2 / 2;padding: 15px;}
main h3{border-bottom: solid 1px #ccc;line-height: 2rem;margin: 0 0 20px;text-transform: uppercase;}
main form{display: grid;grid-template-columns: 1fr;gap: 10px;}


footer{background: #e1dedc;grid-area: 3 / 1 / auto / span 3;display: flex;align-items: center;}
footer p{width: 100%;margin: 0 15px;font-size: 0.8rem;text-align: center;}

/* 
.access{background: none;grid-area: 2 / 2 ;display: grid;grid-template-columns: minmax(0, 1fr); grid-template-rows: 120px minmax(0, 1fr) ;}
.access .owner{grid-area: 1 / 1 ;}
.access .owner h1{text-align: center;}
.access h1 .logo{height: 120px;}

.box{background: #fff;border: solid 1px #ccc;box-shadow: 0 1px 3px rgba(0,0,0,0.25);grid-area: 2/ 1 ;}
.access .box{margin:30px 0;}

.box .title{padding: 30px 30px 0;}
.box .title h2{}
.box .body{padding: 30px 30px 30px;}
.box .body form{}
.box .body form input,
.box .body form select,
.box .body form textarea,{}
 */




.card{background: #fff;border: solid 1px #ccc;box-shadow: 0 1px 3px rgba(0,0,0,0.25);}
.card .card-header,
.card .card-body{background: #fff;}
.card .card-header{color: #000;}
.card .card-body label{color: #000;}
.card .card-body a{color: #000;}


/* 
.card{background: rgb(88,198,233);background: linear-gradient(0deg, rgba(88,198,233,1) 0%, rgba(64,117,252,1) 100%);border: solid 1px #4075FC;box-shadow: 0 1px 3px rgba(0,0,0,0.25);}

.card .card-header{color: #fff;}
.card .card-body label{color: #fff;}
.card .card-body a{color: #fff;}
 */



.access{background: none;grid-area: 2 / 2 ;display: flex;flex-direction: column;}
.owner{}
.owner h1{text-align: center;}
h1 .logo{height: 120px;}
.owner h1 img{width:100%;max-width: 400px;height: inherit;margin:0 0 30px;}



.box{background: #4075FC;border: solid 1px #4075FC;box-shadow: 0 1px 3px rgba(0,0,0,0.25);}
.access .box{width: 450px;margin-top:30px;margin-bottom:30px;align-self: center;}

.box .title{padding: 30px 30px 0;}
.box .title h2{}
.box .body{padding: 30px 30px 30px;}



@media (max-width: 768px) { 

#app{grid-template-columns: 30px 1fr 30px ;transition: 0.4s;}
.access .box{width: 100%;}

}