/*@@@ 

  1.CONFIGURAÇÕES GLOBAIS
    1.1 Definições Globais s111 
    1.2 Variáveis Globais s112
    1.3 Ocultar elementos s113

  2.CLASSES GLOBAIS APEX 
    2.1 Input dos itens s221 
    2.2 Mensagens de erro s222  
    2.3 Modal s223 

  3.MENU SUPERIOR APEX
    3.1 Container principal menu superior s331   
    3.2 Container principal menu inferior s332 
    3.3 Container principal menu inferior ao passar mouse em cima s333
    3.4 Container principal menu inferior quando selecionado s334
    3.5 Container do logo Celos Prev+ s335
    3.6 Âncora do logo s336
    3.7 Logo s337
    3.8 Nome do usuário e ícones do menu superior s338

  4.REGIÃO STANDARD CELOS
    4.1 Container principal s441   
    4.2 Container do título s442
    4.3 Título s443

  5.REGIÃO STANDARD CELOS PORTAL 
    5.1 Container do título s551  

  6.REGIÃO STANDARD PORTAL PREVMAIS 
    6.1 Container principal s661  
    6.2 Container título s662
    6.3 Título s663

  7.REGIÃO INLINE DIALOG CELOS 
    7.1 Container principal s771  
    7.2 Título s772

  8.ITEM OPTIONAL REQUIRED FLOATING CELOS   
    8.1 Input s881
    8.2 Identificador de item obrigatório s882

  9.ITEM OPTIONAL FLOATING CELOS  
    9.1 Input s991

  10.ITEM REQUIRED ABOVE CELOS PORTAL
    10.1 Label s10101 
    10.2 Input s10102
    10.3 Distância entre input e label s10103 
  
  11.ITEM OPTIONAL ABOVE CELOS PORTAL  
    11.1 Label s11111
    11.2 Input s11112
    11.3 Distância entre input e label s11113

  12.ITEM REQUIRED FLOATING PORTAL PREVMAIS    
    12.1 Label s12121
    12.2 Input s12122
    12.3 Identificador de item obrigatório s12123

  13.ITEM FILE DROPZONE 
    13.1 Container principal dos elementos s13131 
    13.2 Texto s13132
    13.3 Ícone s13133

  14.ITEM FOS RANGE SLIDER  
    14.1 Container da barra deslizante s14141
    14.2 Barra deslizante 14142
    14.3 Botão deslizante s14143
    14.4 Botão deslizante quando em foco s14144
    14.5 Número superior barra deslizante s14145
    14.6 Container pips inferior barra deslizante s14146
    14.7 Número inferior barra deslizante s14147
    14.8 Pips inferior barra deslizante s14148
    14.9 Cursor ao passar mouse em cima botão deslizante s14149
    14.10 Cor de fundo da barra deslizante s141410

  15.BOTÃO TEXT CELOS GREEN 
    15.1 Container principal s15151
    15.2 Borda quando em foco s15152
    15.3 Texto s15153
  
  16.BOTÃO TEXT CELOS BLUE
    16.1 Container principal s16161
    16.2 Borda quando em foco s16162
    16.3 Texto s16163

  17.PAGE WIZARD MODAL DIALOG CELOS 
    17.1 Container principal s17171  

@@@*/


/* s111 */
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap');

/* s112 */
:root {  
  --border-celos-blue: 0.2rem solid var(--color-celos-blue);
  --border-radius-region: 1rem;
  --border-radius-item: 0.6rem;
  --border-radius-button: 0.7rem;
  
  --border: 0.1rem solid #dfdfdf;
  --border-radius-celos: 0.6rem;
  --border-radius-gl: 0.5rem;
  --border-radius-popup: 3rem;
  --border-radius-btn: 0.7rem;
  --color-celos-green: #56BAA2;
  --color-celos-blue: #3363AC;
  --color-celos-yellow: #F9B233;
  --c-global-white: #FFFFFF;
  --c-global-black: #000000;
  --c-global-red: #E53935;
  --c-global-light-grey: #dee1e4;
  --c-grey-10: #dfdfdf;

  --color-gl-white: #FFFFFF;
  --color-gl-black: #000000;
  --color-black-1000: #000000;
  --color-white-1000: #FFFFFF;
  --color-yellow-10: #FFF8E1;
  --color-yellow-1000: #FFD700;
  --color-yellow-1100: #FBC02D;
  --color-red-900: #F44336;
  --color-red-1000: #E53935;
  --color-green-500: #4CAF50;
  --color-green-800: #00C853;
  --color-green-900:#388E3C;
  --color-grey-100: #B0BEC5;
  --color-grey-700: #505f6d; 
  --color-blue-10: #effafd;
  --color-blue-20: #eaf6fe;
  --color-blue-600: #3F51B5;
  --color-blue-700: #303F9F;
  --color-orange-10: rgb(255 247 237 / 1);
  --color-orange-700: #FF7043;
  --color-orange-1000: #BF360C;
  --color-orange-1010: rgb(154 52 18 / 1);
  --color-gl-light-grey: #dfdfdf;
  --color-gl-deep-grey: #505f6d;
  --color-border-grey: #dfdfdf;
  --color-border-grey-10: #dfdfdf;
  --color-gl-dark-grey: #66798a;
  --color-gl-red: #E53935;

  --font-celos: 'PT Sans', sans-serif;
  --font-arial: Arial, Helvetica, sans-serif;

  --font-size-html: 62.5%;
  --font-size-140: 1.4rem;
  --font-size-150: 1.5rem;
  --font-size-160: 1.6rem;
  --font-size-170: 1.7rem;
  --font-size-180: 1.8rem;
  --font-size-190: 1.9rem;
  --font-size-200: 2rem;
  --font-size-220: 2.2rem;
  --font-size-250: 2.5rem;

  --font-size-btn: 1.6rem;
  --font-size-text: 1.6rem;
  --font-size-title: 1.9rem;
  --font-size-label: 1.5rem;
  --font-size-medium: 1.5rem;
  --font-size-medium-2: 1.6rem;
  --font-size-x-large: 2.2rem;
}

/* s113 */
.ocultar {  
  display: none !important;
}

/* s221 */
.apex-item-textarea,
.apex-item-number,
.apex-item-text,
.apex-item-select {
  background-color: var(--c-global-white);
}

/* s222 */
.t-Form-error,
.a-Notification-item,
.a-Notification-link,
.t-Form-error { 
  color: var(--c-global-red);
  font-size: var(--font-size-160) !important;
  font-weight: 700;
}

/* s223 */
.ui-button,
.a-AlertMessage-details { 
  font-size: var(--font-size-160);
  line-height: 1.2;
  text-align: justify;
}

/* s331 */
.t-Header-branding { 
  background-color: var(--c-global-light-grey);
  padding-bottom: 0;
  padding-top: 2px;
}

/* s332 */
.a-MenuBar { 
  background-color: var(--color-celos-blue);
}

/* s333 */
.a-MenuBar-item:hover { 
  background-color: rgba(26, 35, 126, 0.5);
}

/* s334 */
.a-MenuBar-item.a-Menu--current { 
  background-color: rgba(26, 35, 126, 0.5);
}

/* s335 */
.t-Header-logo { 
  height: 100%;
  width: 130px;
}

/* s336 */
.t-Header-logo-link { 
  height: 100%;
  width: 100%;
}

/* s337 */
.t-Header-logo-link img { 
  max-height: none;
}

/* s338 */
.has-username button .t-Button-label,
.icon-down-arrow,
.t-NavigationBar-item .fa-user { 
  color: var(--c-global-black);
}

/* s441 */
.t-Region-Celos { 
  border: 0.1rem solid var(--c-grey-10);
  border-radius: var(--border-radius-region);
  font-family: var(--font-celos);
  font-size: var(--font-size-160);
  max-width: 70rem;
}

/* s442 */
.t-Region-header-Celos { 
  border-top-left-radius: var(--border-radius-region);
  border-top-right-radius: var(--border-radius-region);
  border-color: var(--color-celos-blue);
  background-color: var(--color-celos-blue);
  color: var(--c-global-white);
}

/* s443 */
.t-Region-Celos h2 { 
  font-size: var(--font-size-190);
  font-weight: bold;
}

/* s551 */
.t-Region-header-Celos-Portal { 
  border-top-left-radius: var(--border-radius-region);
  border-top-right-radius: var(--border-radius-region);
  color: var(--c-global-black);
}

/* s551 */
.t-Region-header-Celos-Portal .t-Region-headerItems--title { 
  justify-content: center !important;
}

/* s661 */
.t-Region-prevmais { 
  border: 0.1rem solid var(--c-grey-10);
  border-radius: var(--border-radius-region);
  font-size: var(--font-size-160);
  width: 100%;
}

/* s661 */
.t-Region-body-prevmais {
  padding: 0;
}

/* s662 */
.t-Region-header-prevmais { 
  border-top-left-radius: var(--border-radius-region);
  border-top-right-radius: var(--border-radius-region);
  color: var(--c-global-black);
  margin-bottom: 0.7rem;
}

/* s662 */
.t-Region-header-prevmais .t-Region-headerItems--title { 
  justify-content: center;
}

/* s663 */
.t-Region-prevmais h2 { 
  font-size: var(--font-size-190);
  font-weight: bold;
}

/* s771 */
.ui-dialog-Celos { 
  border-radius: var(--border-radius-region);
  margin-bottom: 45rem;
  width: 50rem;
  top: 25rem !important;
}

/* s772 */
.ui-dialog-title-celos { 
  justify-content: center;
  font-size: var(--font-size-190);
  font-weight: bold;
}

/* s881 */
.t-Form-itemWrapper-Celos input {  
  border-radius: var(--border-radius-item);
}

/* s882 */
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer-Celos:before { 
  border-top-left-radius: var(--border-radius-item);
  border-width: 0.6rem;
}

/* s991 */
.t-Form-fieldContainer--floatingLabel .apex-item-display-only { 
  font-size: var(--font-size-160);
  border-style: solid;
  border-radius: var(--border-radius-item);
}

/* s10101 s11111 */
.t-Form-label-celos-portal { 
  font-size: var(--font-size-160) !important;
  font-weight: bold;
}

/* s10101 s11111 */
.t-Form-label-celos-portal-optional { 
  padding-left: 1.5rem;
}

/* s10102 s11112 */
.t-Form-inputContainer-celos-portal .apex-item-display-only { 
  font-weight: normal;
}

/* s10102 s11112 */
.t-Form-inputContainer-celos-portal .apex-item-text,
.t-Form-inputContainer-celos-portal .apex-item-display-only,
.t-Form-inputContainer-celos-portal .apex-item-select { 
  min-width: 100%;
  padding: 1rem 0.5rem;
}

/* s10103 s11113 */
.t-Form-inputContainer-celos-portal .t-Form-itemWrapper { 
  margin-top: 1rem;
}

/* s12121 */
.t-Form-labelContainer-prevmais label {
  transform: translate(0, 177%) translatey(-7rem);
  font-size: var(--font-size-150) !important;
  color: var(--c-global-black);
  font-weight: bold;
  margin-left: 1rem;
  padding: 0 0.3rem;
  background-color: var(--c-global-white);
  width: fit-content;
  padding-right: 0.5rem !important;
  border-bottom: 0.1rem solid var(--c-global-white);
  outline-color: var(--c-global-white);
  box-shadow: none !important;
}

/* s12122 */
.t-Form-inputContainer-prevmais, 
.t-Form-itemWrapper-prevmais input {
  border-radius: var(--border-radius-item);
}

/* s12123 */
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer-prevmais::before {
  display: none;
}

/* s12123 */
.required-prevmais {
  color: var(--c-global-red);
  font-weight: bold;
  font-size: 1.6rem;
}

/* s13131 */
.a-FileDrop--inlineDropzone { 
  border-color: var(--c-global-black);
  border-radius: var(--border-radius-item);
}

/* s13132 */
.a-FileDrop-description,
.a-FileDrop-heading { 
  color: var(--c-global-black);
}

/* s13132 */
.card-file-name { 
  word-break: break-all;
}

/* s13133 */
.a-Icon.icon-file-browse { 
  color: var(--c-global-black);
  font-weight: 700;
}

/* s14141 */
.range-slider-horizontal {
  margin: 28px 15px 35px 15px;
}

/* 14142 */
.noUi-connects {
  border: 1.5px solid var(--color-celos-blue);
}

/* 14142 */
.noUi-horizontal {
  height: 6px;
}

/* 14142 */
.noUi-horizontal .noUi-tooltip {
  left: 10;
}

/* s14143 */
.noUi-horizontal .noUi-handle {
  top: -8px;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-celos-blue);
  border-radius: 50%;
  background-color: var(--color-celos-blue);
}

/* s14143 */
.noUi-handle {
  box-shadow: none;
  cursor: pointer;
}

/* s14143 */
.noUi-handle:before, .noUi-handle:after { 
  display: none;
}

/* s14144 */
.noUi-horizontal .noUi-handle:focus {
  outline-color: var(--color-celos-blue);
}

/* s14145 */
.noUi-tooltip {
  border: none;
  color: var(--color-celos-blue);
  background-color: transparent;
  font-weight: 700;
  font-size: var(--font-size-160);
}

/* s14146 */
.noUi-pips-horizontal {
  padding: 5px;
  margin-left: 6px;
}

/* s14147 */
.noUi-value {
  font-size: var(--font-size-160);
  color: var(--color-celos-blue);
  font-weight: 700;
  background-color: transparent;      
  padding-left: 0.5rem;
}

/* s14148 */
.noUi-marker-horizontal {
  display: none;
}

/* s14149 */
.noUi-touch-area {
  display: none;
}

/* s141410 */
.noUi-connect {
  background-color: var(--color-celos-blue) !important;
}

/* s15151 s16161 */
.t-Button-Celos-Blue { 
  background-color: var(--color-celos-blue);
  border: 0.1rem solid var(--color-celos-blue);
}

/* s15151 s16161 */
.t-Button-Celos-Green { 
  background-color: var(--color-celos-green);
  border: 0.1rem solid var(--color-celos-green);
}

/* s15151 s16161 */
.t-Button-Celos-Green,
.t-Button-Celos-Blue { 
  border-radius: var(--border-radius-button);
  color: var(--c-global-white);
}

/* s15152 s16162 */
.t-Button-Celos-Blue:focus,
.t-Button-Celos-Blue:focus-within { 
  outline-color: var(--color-celos-blue);
}

/* s15152 s16162 */
.t-Button-Celos-Green:focus,
.t-Button-Celos-Green:focus-within { 
  outline-color: var(--color-celos-green);
}

/* s15153 s16163 */
.t-Button-Celos-Green span,
.t-Button-Celos-Blue span { 
  font-size: var(--font-size-160);
  font-weight: bold;
  text-transform: uppercase;
}

/* s17171 */
.modal-celos-prevmais { 
  border-radius: var(--border-radius-region);
  width: 40rem !important;
}

@media screen and (max-width: 480px) {
  /* s10102 s11112 */
  .t-Form-inputContainer-celos-portal .apex-item-text,
  .t-Form-inputContainer-celos-portal .apex-item-display-only,
  .t-Form-inputContainer-celos-portal .apex-item-select {
    max-width: 30rem;
  }

  /* s17171 */
  .modal-celos-prevmais { 
    width: 100% !important;
  }  

  /* s771 */
  .ui-dialog-Celos { 
    width: 95% !important;
    margin-bottom: 38rem;
  }

  /* s661 */
  .t-Region-body-prevmais { 
    padding: 0.5rem;
  }  

  /* s13132 */
  .a-FileDrop-description,
  .a-FileDrop-heading { 
    overflow: visible;
  }  
}

/* mover classe para página que a utiliza */
.rateio {
  color: var(--color-celos-blue);
  font-size: var(--font-size-text);
  font-weight: bold;
  margin-left: 1rem;
}