:root {
    --color-pa--background: var(--color-pa-L--background);
    --color-pa--title: var(--color-pa-L--title);
    --color-pa--label: var(--color-pa-L--label);
    --color-pa--input-background: var(--color-pa-L--input-background);
    --color-pa--header-background: var(--color-pa-L--header-background);
    --color-pa--input-placeholder: var(--color-pa-L--input-placeholder);
    --color-pa--input-color: var(--color-pa-L--input-color);
    --color-pa--btn-fc: var(--color-pa-L--btn-fc);
    --color-pa--btn-buld: #141414;
    --color-pa--background-icon: var(--primary);
    --color-pa--borde-icon: var(--primary);
    --color-pa--box-icon: 0px 4px 4px black, 0px 0px 6px rgba(0, 0, 0, 0.05);
    --color-pa--color-icon: var(--color-pa-L--color-icon);
    --color-pa--color-text: var(--primary);
    --color-pa--color-cand-item: #525252;
    --color-pa--color-icon-p: var(--color-pa-L--color-icon-p);
    --color-pa--color-menu: var(--color-pa-L--color-menu);
    --color-pa--card-background: #ffffff;
    --color-pa--btn-primary: var(--primary);
    --color-pa--btn-text: #ffffff;
    --color-pa--pn-disabled: #C2C2C2;
    --color-pa--pn-active: #525252;
    --portal--background-card: #D1D1D1;
}

@media (prefers-color-scheme: dark) {
    :root {
        --color-pa--background: var(--color-pa-D--background);
        --color-pa--title: var(--color-pa-D--title);
        --color-pa--label: var(--color-pa-D--label);
        --color-pa--input-background: var(--color-pa-D--input-background);
        --color-pa--header-background: var(--color-pa-D--header-background);
        --color-pa--input-placeholder: var(--color-pa-D--input-placeholder);
        --color-pa--input-color: var(--color-pa-D--input-color);
        --color-pa--btn-fc: var(--color-pa-D--btn-fc);
        --color-pa--btn-buld: #D1D1D1;
        --color-pa--background-icon: transparent;
        --color-pa--borde-icon: var(--color-pa-D--color-icon);
        --color-pa--box-icon: none;
        --color-pa--color-icon: var(--color-pa-D--color-icon);
        --color-pa--color-text: #D1D1D1;
        --color-pa--color-cand-item: #777;
        --color-pa--color-icon-p: var(--color-pa-D--color-icon-p);
        --color-pa--color-menu: var(--color-pa-D--color-menu);
        --color-pa--card-background: var(--color-pa-D--header-background);
        --color-pa--btn-primary: var(--color-pa-D--color-menu);
        --color-pa--btn-text: var(--color-primary-background);
        --color-pa--pn-disabled: #525252;
        --color-pa--pn-active: #C2C2C2;
        --portal--background-card: var(--color-card-dark);
    }
}

html.light {
    --color-pa--background: var(--color-pa-L--background);
    --color-pa--title: var(--color-pa-L--title);
    --color-pa--label: var(--color-pa-L--label);
    --color-pa--input-background: var(--color-pa-L--input-background);
    --color-pa--header-background: var(--color-pa-L--header-background);
    --color-pa--input-placeholder: var(--color-pa-L--input-placeholder);
    --color-pa--input-color: var(--color-pa-L--input-color);
    --color-pa--btn-fc: var(--color-pa-L--btn-fc);
    --color-pa--btn-buld: #141414;
    --color-pa--background-icon: var(--primary);
    --color-pa--borde-icon: var(--primary);
    --color-pa--box-icon: 0px 4px 4px black, 0px 0px 6px rgba(0, 0, 0, 0.05);
    --color-pa--color-icon: var(--color-pa-L--color-icon);
    --color-pa--color-text: var(--primary);
    --color-pa--color-cand-item: #525252;
    --color-pa--color-icon-p: var(--color-pa-L--color-icon-p);
    --color-pa--color-menu: var(--color-pa-L--color-menu);
    --color-pa--card-background: #ffffff;
    --color-pa--btn-primary: var(--primary);
    --color-pa--btn-text: #ffffff;
    --color-pa--pn-disabled: #C2C2C2;
    --color-pa--pn-active: #525252;
    --portal--background-card: #D1D1D1;
}

html.dark {
    --color-pa--background: var(--color-pa-D--background);
    --color-pa--title: var(--color-pa-D--title);
    --color-pa--label: var(--color-pa-D--label);
    --color-pa--input-background: var(--color-pa-D--input-background);
    --color-pa--header-background: var(--color-pa-D--header-background);
    --color-pa--input-placeholder: var(--color-pa-D--input-placeholder);
    --color-pa--input-color: var(--color-pa-D--input-color);
    --color-pa--btn-fc: var(--color-pa-D--btn-fc);
    --color-pa--btn-buld: #D1D1D1;
    --color-pa--background-icon: transparent;
    --color-pa--borde-icon: var(--color-pa-D--color-icon);
    --color-pa--box-icon: none;
    --color-pa--color-icon: var(--color-pa-D--color-icon);
    --color-pa--color-text: #D1D1D1;
    --color-pa--color-cand-item: #777;
    --color-pa--color-icon-p: var(--color-pa-D--color-icon-p);
    --color-pa--color-menu: var(--color-pa-D--color-menu);
    --color-pa--card-background: var(--color-pa-D--header-background);
    --color-pa--btn-primary: var(--color-pa-D--color-menu);
    --color-pa--btn-text: var(--color-primary-background);
    --color-pa--pn-disabled: #525252;
    --color-pa--pn-active: #C2C2C2;
    --portal--background-card: var(--color-card-dark);
}

html,
.btn-fale-conosco {
    background: var(--color-pa--background)!important;
}

body {
    min-height: 100%;
    background: url('/assets/img/background.svg')!important;
    background-size: 100%!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    background-color: transparent!important;
    height: 100vh;
}

div.page, .section {
    background: transparent!important;
}

.title, .title-h3, .document-name {
    color: var(--color-pa--title);
}

span.document-name {
    color: var(--color-pa--title)!important;
}

.subtitle {
    color: var(--color-pa--title);
}

.header, .card-group-service {
    background: var(--color-pa--header-background)!important;
}

.card-group-service {
    border-left: solid 1px var(--color-pa--borde-icon);
}

.app-highlight > .app-card {
    border-left: solid 1px var(--color-pa--borde-icon)!important;
}

/* INPUTS */

.ui-input > .control {
    background: var(--color-pa--input-background)!important;
}

.ui-input > .label {
    color: var(--color-pa--label);
}

.ui-input > .control > input {
    color: var(--color-pa--input-color)!important; 

    &::placeholder {
        color: var(--color-pa--input-placeholder)!important;
    }

    &::-ms-input-placeholder {
        color: var(--color-pa--input-placeholder)!important;
    }

}

/* INPUTS END */

/* BUTTONS */

.btn-fale-conosco {
    background: var(--color-pa--header-background)!important;
    color: var(--color-pa--btn-fc)!important;
    box-shadow: none!important;
}

.button.is-primary {

}

.link-header-buld path {
    fill: var(--color-pa--btn-buld);
}

/* BUTTONS END */

.v-step__content {
    color: #DAEFF3;
    background: #191D21;
}

.card-group-service > .card-body-service > a > .custom-icon {
    background: var(--color-pa--background-icon)!important;
    box-shadow: var(--color-pa--box-icon)!important;
    border: solid 1px var(--color-pa--borde-icon);
}

.card-group-service > .card-body-service > a > .custom-icon > svg > path,
.card-group-service > .card-body-service > a > .custom-icon > svg > g > path {
    fill: var(--color-pa--color-icon)!important;
}


.card-body-service .column.is-full-mobile.is-one-third.app-card > .exp-card-progress > div.exp-title > span.app-card-title,
.card-body-service > .app-card > span.app-card-title {
    color: var(--color-pa--color-text)!important;
}

.card-body-service > .app-card {
    position: relative;
}

.card-group-service > .card-body-service > a > .app-card-title
.exp-card-progress > div.exp-title {
    color: var(--color-pa--borde-icon)!important;
}

.exp-card > .exp-bell {
    left: 38px!important;
    top: -25px!important;
    box-shadow: none!important;
    background: var(--color-pa--background-icon)!important;
    border: solid 1px var(--color-pa--borde-icon);
}

.exp-card > .exp-bell > .custom-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: inherit!important;
}

.exp-card > .exp-bell > .custom-icon > svg > path {
    fill: transparent!important;
    stroke: var(--color-pa--color-icon)!important;
}

#header-info {
    border-radius: 16px;
    border-left: solid 1px var(--color-pa--borde-icon);
}

#header-info h2.title {
    margin-top: -20px!important;
}

#header-info h2.title,
#header-info .title-id,
#header-info .title-id strong {
    color: var(--color-pa--title)!important;
}

.app-card .app-card-title {
    color: var(--color-pa--title)!important;
}

.app-card-item-wrapper > .app-card-item {
    color: var(--color-pa--color-cand-item)!important;
}

.app-highlight > a.app-card > .app-card-icon > svg > path {
    fill: var(--color-pa--color-icon-p)!important;
}

.header .link-header,
.header .btn-servicos,
.header .btn-notification > div svg path {
    color: var(--color-pa--color-menu)!important;
}

.header .btn-notification div svg path {
    color: var(--color-pa--color-menu)!important;
    fill: var(--color-pa--color-menu)!important;
    stroke: var(--color-pa--color-menu)!important;
}

.ajuda {
    border-radius: 16px;
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	left: 0px;
	color: var(--color-tooltip-text);
}

.ajuda > .ajuda-content {
    border-radius: 1.3rem!important;
    background: var(--color-tooltip-background)!important;
}

.ajuda::after {
    content: "";
	position: absolute;
	top: 100%;
	left: 0;
	margin: 10px;
	border-width: 15px;
    border-radius: 4px;
	border-style: solid;
	border-color: var(--color-tooltip-background) transparent transparent transparent!important;
}

.online-help {
    color: var(--color-pa--color-icon-p)!important;
    border: 2px solid var(--color-pa--color-icon-p)!important;
    background: var(--color-pa--background)!important;
}

.online-help > .mr-7 > .icon,
.online-help > .pl-2 > p.primary-color {
    color: var(--color-pa--color-icon-p)!important;
}

.panel {
    background: var(--color-pa--card-background)!important;
}

.panel-header {
    background: var(--color-pa--card-background)!important;
}

.panel-content {
    background: var(--color-pa--card-background);
    color: var(--color-pa--pn-active);
}

.panel-content .justify-with-image {
    color: var(--color-pa--title);
}

button.button.is-primary {
    background: var(--color-pa--btn-primary)!important;
    color: var(--color-pa--btn-text)!important;
}

.dropdown-content {
    background: var(--color-pa--card-background)!important;
    color: var(--color-pa--color-menu)!important;
}

.dropdown-content > .has-link > .dropdown-link {
    color: var(--color-pa--color-menu)!important;
}

.dropdown-content > .has-link > .dropdown-link:hover {
    background: var(--color-pa--card-background)!important;
    opacity: 0.4;
}

.tabs > ul > li > a > span {
    color: #d1d1d1!important;
}

.tabs > ul > li.is-active > a > span {
    color: var(--color-pa--color-menu)!important;
}

.progress-box > .progress-text > .progress-bar-desc,
.progress-box > .progress-text > .progress-bar-desc strong {
    color: var(--color-pa--title);
    opacity: 0.8;
}

.custom-pagination > button {
    background: var(--color-pa--card-background)!important;
    border-color: var(--color-pa--title)!important;
    border: none!important;
}

.custom-pagination > button.selected:disabled {
    color: var(--color-pa--btn-text)!important;
    background-color: var(--color-pa--btn-primary)!important;
}

.custom-pagination > button {
    color: var(--color-pa--pn-active)!important;
    transition: 0.4s;
}

.ui-input > .control > input::placeholder {
    color: var(--color-pa--pn-active)!important;
    opacity: 0.4;
}

.custom-pagination > button:disabled {
    color: var(--color-pa--pn-disabled)!important;
}

.custom-pagination > button.custom-pagination-next-button:hover:not(:disabled),
.custom-pagination > button.custom-pagination-last-button:hover:not(:disabled),
.custom-pagination > button.is-hidden-mobile:hover:not(:disabled) {
    color: var(--color-pa--pn-disabled)!important;
    transition: 0.4s;
}

.custom-pagination > button:first-child {
    border-radius: 16px 0px 0px 16px;
}

.custom-pagination > button:last-child {
    border-radius: 0px 16px 16px 0px;
}

a.is-link {
    color: var(--color-pa--color-menu)!important;
}

.esqueciSenha a.is-link.is-block.textEsqueciSenha {
    color: var(--color-pa--pn-active)!important;
}
