body{ 
    font-family:system-ui,Arial,sans-serif;
    margin:0; 
    padding:0; 
    background:#f6f7fb;
}
header, footer{
    padding:16px;
    background: #fafbfc;
    color: #111827;
    height: 45px;
}

header h1{margin: 0px;}

main, .div-main{
    max-width:950px; 
    min-height: 70vh;
    margin:20px auto; 
    background:#fff; 
    padding:24px; 
    border-radius:12px; 
    box-shadow:0 6px 24px rgba(0,0,0,.08);
}

.div-main{
    overflow-y: auto;
    max-height: 75vh;
}

a.button{
    display:inline-block;
    padding:10px 14px; 
    border-radius:8px; 
    text-decoration:none; 
    background:#2563eb;
    background:#5675b8; 
    background:#4c37a8; 
    border: none;
    color:#fff; 
    margin-right:8px;
    cursor: pointer;
}
a{
    text-decoration:none;
}

.button{
    padding:10px; 
    border-radius:8px; 
    background:#2564ebd8;
    background:#4c37a8; 
    color:#fff; 
    cursor: pointer;
}

.button:hover{ 
    background:#2563eb; 
    background:#331d91; 
}

/* estado disabled */
.button:disabled{
    background: #bdbdbd;
    color: #666;
    cursor: not-allowed;
    opacity: 0.7;
}

input:disabled, select:disabled, textarea:disabled {
    background: #f0efef;
    color: #242424;
    cursor: not-allowed;
    opacity: 0.9;
}

/* remove o efeito hover quando disabled */
.button:disabled:hover {
    background: #bdbdbd;
}

.button {
    transition: opacity 0.2s ease, background 0.2s ease;
}

.badge{
    display:inline-block; 
    padding:2px 8px; 
    border-radius:999px; 
    font-size:12px; 
    background:#e5e7eb; 
    margin-right:6px;
}
pre{
    background:#0b1020; 
    color:#bfe1ff; 
    padding:12px; 
    border-radius:10px; 
    overflow:auto;
}
.divbloco{
    background:#e5e7eb; 
    background:  #cfd6e536;
    padding:12px; 
    border-radius:10px;
    margin-bottom: 10px;
}
.divbloco h2{
    margin-top: 3px;
}
.divbloco p, .divbloco div{
    text-align: justify;
}

input, select{
    padding: 8px;
    border: 1px solid #cfd1d4ff; 
    border-radius:10px;
    width: 230px;
}

.search {
    width: 70%;
    padding: 15px;
    font-size: large;
}

select {
    width: 150px;
}

.disp-flex-gap{
    display: flex; 
    flex-wrap:wrap; 
    gap:5px;
}

.disp-grid-gap p{
    display: grid;
    gap: 5px;
    margin-top: 0px;
}

.non-back{
    background: none;
}

.textarea{
    position: relative;
    width: 850px;
    width: 100%;
    min-height: 60px;
    padding: 10px;
}

footer{
    text-align: center;
    padding:0px;
    height: 20px;
}

.wth-100{ width: 100%;}
.wth-90{ width: 90%;}
.wth-auto{ width: auto;}

.disp-nn{display: none;}


/* BTN */

.btn-plus{
    height: 200px;
    width: 200px;
    border-radius: 10px;
    background: #fff;
    color: #2563EB;
    color: #4c37a8;
    text-align: center;
    align-items: center;
    margin-bottom: 10px;
}

.btn-plus input{
    background: #fff;
    color: #2563EB;
    color: #4c37a8;
    border: 1px solid #2563EB;
    border: 1px solid #cfd1d4ff; /* #4c37a8; */
    font-size: 100px;
    width: 100%;
    height: 90%;
}

.disp-flex-wrap{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: justify;
}

.disp-flex-nowrap{
    display: flex;
    gap: 10px;
    justify-content: justify;
}

.disp-flex-wrap span{
    font-size: 25px;
}

.j-c-s-b{
    justify-content: space-between;
}

.j-c-s-a{
    justify-content: space-around;
}

.j-c-s-e{
    justify-content: space-evenly;
}

.j-c-c{
    justify-content: center;
}

.div-btn-plus{
    /* min-height: 55vh; */
    align-items: center;
}

.font-large{
    font-size: large;
}

.cursor-p{
    cursor: pointer;
}

.border{
    border: 1px solid #4c37a8;
}

.borderNo{
    border: none;
}

.border-noTo{
    border-top: none;
}

.border-noBot{
    border-bottom: none;
}

.border-noRi{
    border-right: none;
}

.border-noLef{
    border-left: none;
}

.center{
    text-align: center;
}

.list-st-no{
    list-style: none;
}

ul li{
    list-style-type: disclosure-closed;
}

.heigth-55{ height: 55px; }