/* 
    Created on : 22 de abr. de 2024, 08:03:32
    Author     : marcelopinho
*/

.layout-main {
    padding-top: 62px;
}
.layout-content {
    padding-top: 14px;
    padding-bottom: 14px;
}

.background-color {
    background: var(--surface-b) !important;
}

.login-body .login-wrapper .login-panel {
    padding: 30px 20px;
}
.login-body .login-wrapper .login-panel .logo {
    margin-bottom: 10px;
}
.login-body .login-wrapper .login-panel .logo img {
  width: 125px;
  height: 104px;
}
.login-body .login-wrapper .login-panel H4 {
    color: var(--surface-500);
    margin-bottom: 20px;
}
.login-body .login-wrapper .login-panel .flex input {
    width: 300px;
    background-color: #F6F7F7;
}
.login-body .login-wrapper .login-panel .ui-messages {
    width: 300px;
    margin-bottom: 20px;
}
.login-body .login-wrapper .login-panel > input {
    width: 300px;
    min-width: 300px;
}
.login-body .login-wrapper .login-panel > button {
    max-width: 300px;
    min-width: 300px;
}

.login-body .login-wrapper .login-footer {
    width: 315px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 50px;
}
.login-body .login-wrapper .login-footer h4 {
    line-height: 22px;
    margin-right: 10px;
    font-size: 21px;
}
.login-body .login-wrapper .login-footer h6 {
    padding-top: 3px;
    line-height: 16px;
    color: rgba(41, 50, 65, 0.5);
    font-weight: 500;
    font-size: 11px;
}
.login-body .login-wrapper .login-footer h5 {
    margin: 0px;
    padding-top: 3px;
    line-height: 18px;
    font-size: 15px;
}
.break {
  flex-basis: 100%;
  height: 0;
}


.ui-float-label>input:focus ~ label,.ui-float-label>input.ui-state-filled ~ label,.ui-float-label>textarea:focus ~ label,.ui-float-label>textarea.ui-state-filled ~ label,.ui-float-label>.ui-inputwrapper-focus ~ label,.ui-float-label>.ui-inputwrapper-filled ~ label {
    top: -.95em;
}
.ui-float-label>input:-webkit-autofill ~ label,.ui-float-label>textarea:-webkit-autofill ~ label {
    top: -.95em;
}


.ui-fluid .ui-selectonebutton.ui-buttonset.ui-buttonset-1 .ui-button {
    width: 100%;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.ui-fluid .ui-selectonebutton.ui-buttonset.ui-buttonset-2 .ui-button {
    width: 50%;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.ui-fluid .ui-selectonebutton.ui-buttonset.ui-buttonset-3 .ui-button {
    width: 33.3%;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
.ui-fluid .ui-selectonebutton.ui-buttonset.ui-buttonset-4 .ui-button {
    width: 25%;
    border-width: 1px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
@media (max-width: 640px) {
    .ui-fluid .ui-buttonset.ui-buttonset-5 .ui-button,
    .ui-fluid .ui-buttonset.ui-buttonset-6 .ui-button,
    .ui-fluid .ui-buttonset.ui-buttonset-7 .ui-button,
    .ui-fluid .ui-buttonset.ui-buttonset-8 .ui-button {
        width: 100%;
    }
}


div.ui-inputfield:read-only, input.ui-inputfield:read-only, textarea.ui-inputfield:read-only {
    background: var(--indigo-50) !important;
    &.ui-state-hover {
        background: var(--indigo-50) !important;
    }
    &.ui-state-focus {
        background: var(--indigo-50) !important;
    }
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: var(--primary-light-color);
    color: #fff;
    text-align: center;
    font-size: .875rem;
    border-radius: 6px;
    padding: 7px;
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    margin-left: -60px;
}
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--primary-light-color) transparent transparent transparent;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* Uso do Tooltip: Inserir no XHTML
<div class="tooltip">
    <sup>&#128712;</sup>
    <span class="tooltiptext">Anexar comprovação do registro profissional</span>
</div>
*/


.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo {
  height: 25px;
  }
.layout-topbar-light .layout-topbar .layout-topbar-wrapper .layout-topbar-left .layout-topbar-logo > img {
  height: 25px;
}

.login-body .ui-outputlabel {
    margin-bottom: 2px;
}


.exception-body.notfound .exception-wrapper .exception-content > span.exception-subtitle {
    margin-top: 160px;
}
.exception-body.notfound .exception-wrapper .exception-content > span.exception-subtitle.asset-404 {
    margin-top: 0px;
}

.exception-body .exception-wrapper .exception-footer {
    width: 330px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}
.exception-body .exception-wrapper .exception-footer h4 {
    line-height: 22px;
    margin-right: 10px;
    font-size: 21px;
}
.exception-body .exception-wrapper .exception-footer h6 {
    padding-top: 3px;
    line-height: 16px;
    color: rgba(41, 50, 65, 0.5);
    font-weight: 500;
    font-size: 11px;
}
.exception-body .exception-wrapper .exception-footer h5 {
    margin: 0px;
    padding-top: 3px;
    line-height: 18px;
    font-size: 15px;
}

.ui-scrolltop {
    background: var(--text-color-secondary) !important;
    opacity: 0.7 !important;
}

body .ui-growl {
    top: 30px;
}
body .ui-growl .ui-growl-message {
    padding: 0px;
}
body .ui-growl .ui-growl-title {
    padding: 0px;
}

.form-title{
    
}


.max-w-35rem {
    max-width: 35rem !important;
}
.max-w-40rem {
    max-width: 40rem !important;
}
.max-w-45rem {
    max-width: 45rem !important;
}
.max-w-50rem {
    max-width: 50rem !important;
}
.max-w-55rem {
    max-width: 55rem !important;
}
.max-w-60rem {
    max-width: 60rem !important;
}
.max-w-65rem {
    max-width: 65rem !important;
}


.min-w-5rem {
    min-width: 5rem !important;
}
.min-w-10rem {
    min-width: 10rem !important;
}
.min-w-15rem {
    min-width: 15rem !important;
}
.min-w-20rem {
    min-width: 20rem !important;
}
.min-w-25rem {
    min-width: 25rem !important;
}
.min-w-30rem {
    min-width: 30rem !important;
}
.min-w-35rem {
    min-width: 35rem !important;
}
.min-w-40rem {
    min-width: 40rem !important;
}
.min-w-45rem {
    min-width: 45rem !important;
}
.min-w-50rem {
    min-width: 50rem !important;
}
.min-w-55rem {
    min-width: 55rem !important;
}
.min-w-60rem {
    min-width: 60rem !important;
}
.min-w-65rem {
    min-width: 65rem !important;
}

/* stripedRows com um pequeno ajuste na tonalidade */
body .ui-datatable.ui-datatable-striped .ui-datatable-data > tr.ui-datatable-odd {
  background: var(--surface-50);
}
body .ui-datatable.ui-datatable-striped .ui-datatable-data > tr.ui-datatable-odd.ui-state-hover {
  background: rgba(255, 129, 14, 0.2);
  color: var(--text-color);
}
body .ui-datatable.ui-datatable-striped .ui-datatable-data > tr.ui-datatable-odd.ui-state-highlight {
  background: var(--primary-color);
  color: #FFFFFF;
}
