@import url("/SU_Theme/Theme.SU_Theme.css?27925");

/* ===================================================================== */
/* ===================================================================== */

/*  ProtocolosOnline_UiWeb Theme -                                             */

/*  $1 - Root - CSS Variables                                            */
/*  $2 - Styles                                                          */
/*       $2.1 - Styles - Typography                                      */
/*              $2.1.1 - Styles - Typography - Custom Fonts              */
/*       $2.2 - Theme                                                    */
/*              $2.2.1  - Theme - Main Definitions                       */
/*              $2.2.1  - Theme - Structure                              */
/*       $2.3 - Styles - Colors                                          */
/*              $2.3.1  - Styles - Colors - Brand                        */
/*   $3 - Patterns                                                       */
/*       $3.1 - Patterns - OutsystemsUI                                  */
/*       $3.2 - Patterns - Columns                                       */
/*       $3.3 - Patterns - Floating Actions                              */
/*       $3.4 - Patterns - Separator                                     */
/*       $3.5 - Patterns - Tabs                                          */
/*   $4 - Widgets                                                        */
/*       $4.1 - Widgets - OutsystemsUI                                   */
/*       $4.2 - Widgets - RichWidgets                                    */
/*       $4.3 - Widgets - Buttons                                        */
/*       $4.4 - Widgets - Editable Table                                 */
/*       $4.5 - Widgets - Feedback Ajax Wait                             */
/*       $4.6 - Widgets - Form Elements                                  */
/*   $5 - Forms                                                          */
/*       $5.1 - Forms > Inputs, Selects & Textarea                       */
/*       $5.2 - Forms > ReadOnly & Disabled                              */
/*       $5.3 - Forms > Not Valid                                        */
/*       $5.4 - Forms > Radio Button & Checkbox                          */
/*   $6 - DynamicThemes                                                  */


/* ===================================================================== */
/* ===================================================================== */

:root {   
     /* Color Brand*/
    --color-G4: #331c54;
    --color-G3: #820096; 
    --color-G8: #3C6FB7;
    --color-G9: red;



    /*Color Neutral*/
    --color-primary: #331c54;
    --color-secondary:#820096;
    --color-terciary: #3C6FB7;
    --color-quaternary: red;

} 

/* ================================================================ */
/*  $2.1 - Styles - Typography                                      */
/* ================================================================ */

@font-face {
  font-family: 'Raleway-Regular';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/raleway/v22/1Ptug8zYS_SKggPNyC0ITw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Raleway-Semi-Bold';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/raleway/v22/1Ptug8zYS_SKggPNyC0ITw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Raleway-Bold';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/raleway/v22/1Ptug8zYS_SKggPNyC0ITw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    font-family: 'Raleway-Regular';
}

.Raleway-Regular {
    font-family: 'Raleway-Regular';
    color: var(--color-primary);
}

.Raleway-Semi-Bold {
    font-family: 'Raleway-Semi-Bold';
    color: color: var(--color-primary);
}

.Raleway-Bold {
    font-family: 'Raleway-Bold';
    color: color: var(--color-primary);
}

/* Please Include this CSS in your theme */

/*------------------------------------------------------------*/
/* Example1 > Feedback Ajax Loading ***************************/
/*------------------------------------------------------------*/


div.Feedback_AjaxWait {
    background-image: url(/ProtocolosOnline_V2/img/spin2.gif?27747);
    background-size: 70px;
    background-repeat: no-repeat;
    background-color: black;
    background-position: center;
    opacity: 75%;
    color: black;
    left: 0;
    position: fixed;
}

div.Feedback_AjaxWait::after{
    color: #fff;
    content: "A Carregar...";
    font-size: 16px;
    left: 49%;
    transform: translate(-40px);
    position: absolute;
    right: 0;
    top: 55vh;
    animation: blink 4s linear infinite;
}

@keyframes blink{
    50%{opacity: 0;}
}

.Loader{
    display: none;
}
/* ================================================================ */
/*  $2.2 - Theme                                                    */
/* ================================================================ */

body {
    font-family: 'Raleway-Regular';
    font-size: var(--font-size-xs);
    margin: 0px;
    height:auto;
    background-color: var(--color-neutral-0);
}

body, select, textarea, input {
    font-size: 12px;
    font-family: 'verdana', 'lucida grande', 'lucida sans unicode', 'lucida sans', 'helvetica nueue', arial, helvetica, sans-serif;
}

div.Header {
    background: url(/ProtocolosOnline_V2/img/bg_header.jpg?27747) no-repeat right;
    background-color: var(--color-secundary);
   
}

td.Header_Title_Image {
    padding-left: 10px;
    width:275px;
    background:url(/ProtocolosOnline_V2/img/bg_headerTitle.gif?27747) no-repeat right;
}



td.Header_Title_Image img{
    max-height:54px;
}

td.Header_Title_Application {
    font-size: 24px;
    padding-left:5px;
    vertical-align: middle;
    height: 100%;
}

.Dados_Wrapper{
    max-width: 750px;
}
.Title_Line{
    border-bottom: 1px solid var(--color-terciary)
}
.Showrecord_Buttons {
    border-bottom: 2px solid var(--color-secundary);
}

.LastModified {
    font-size: 9px;
}

.MainContent{
    width:100%;    
    
}

.MainContentAcornet{
    width:650px;    
    
}

span.ValidationMessage {
    color: #BF1601;
    font-size: 10px;
    position: absolute;
    padding: 6px;
    font-weight: bold;
    background: transparent;
    z-index: 100;
    display: inline-block;
}

a:hover {
background-color: transparent;
}


.MB_Table, .OSInlineClear.MB_Table {
    border:2px #d4d3d3 solid;
    border-spacing:10px;
    display:inline-table;
    width:300px;
}


/*------------------------------------*\
    $5. Forms
\*-------------------------------------*/

/*------------------------------------------------------------*/
/* 5.1 Forms > Inputs, Selects & Textarea *********************/
/*------------------------------------------------------------*/


/* responsive context */
 input[type="text"], 
 input[type="password"], 
 input[type="datetime"], 
 input[type="datetime-local"], 
 input[type="date"], 
 input[type="time"], 
 input[type="week"], 
 input[type="number"], 
 input[type="email"], 
 input[type="url"], 
 input[type="search"], 
 input[type="tel"], 
 input[type="color"], 
 select{
     height: 30px;
    text-overflow: ellipsis;
 }

.tablet input[type="text"], 
.tablet input[type="password"], 
.tablet input[type="datetime"], 
.tablet input[type="datetime-local"], 
.tablet input[type="date"], 
.tablet input[type="month"], 
.tablet input[type="time"], 
.tablet input[type="week"], 
.tablet input[type="number"], 
.tablet input[type="email"], 
.tablet input[type="url"], 
.tablet input[type="search"], 
.tablet input[type="tel"], 
.tablet input[type="color"], 
.tablet select{
    height: 30px;
    text-overflow: ellipsis;
}

.phone input[type="text"], 
.phone input[type="password"], 
.phone input[type="datetime"], 
.phone input[type="datetime-local"], 
.phone input[type="date"], 
.phone input[type="month"], 
.phone input[type="time"], 
.phone input[type="week"],
.phone input[type="number"], 
.phone input[type="email"], 
.phone input[type="url"], 
.phone input[type="search"], 
.phone input[type="tel"], 
.phone input[type="color"], 
.phone select {
    min-width: 30vw;
    height: 30px;
    text-overflow: ellipsis; 
}

.EditRecord input:not(.Button){
    height: 30px;
    padding: var(--space-none) var(--space-s);

}

.tablet .MainPopup [class*="ThemeGrid_Width"]:not(.no-responsive){
    width: auto;
    margin: inherit;
}
.select{
    height: 30px;
    text-overflow: ellipsis;
}
.Form textarea.ReadOnly[disabled="disabled"],
.Form select.ReadOnly[disabled="disabled"],
.Form input.ReadOnly[disabled="disabled"],
textarea[disabled="disabled"],
select[disabled="disabled"],
input[disabled="disabled"]{
   height: 30px;
   text-overflow: ellipsis;
}

/*------------------------------------------------------------*/
/*$5.4 - Forms > Radio Button & Checkbox*/  
/*------------------------------------------------------------*/
/*Fix for RadioButton at EditTable*/
.EditRecord input:not(.Button).radio-button {
    border: var(--border-size-s) solid transparent;
    
}

/*Buttons*/
.Button {
    background-color: var(--color-terciary);
    border: var(--border-size-m) solid var(--color-secundary);
    color: var(--color-neutral-0);
    height: var(--space-xl);
    border-radius: var(--border-radius-soft);
}
.Button.Is_Default {
    background-color: var(--color-terciary);
    color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-10);
    cursor: pointer;
}
.Button:hover {
    background-color: var(--color-G8);
    border: var(--border-size-m) solid var(--color-neutral-10);
    color: var(--color-neutral-10);
    /* -webkit-filter: brightness(100%); */
    filter: brightness(90%)
}

.Button:hover:active {
    background-color: var(--color-white);
    border: var(--border-size-m) solid var(--color-primary);
    color: var(--color-black);
    /* -webkit-filter: brightness(100%); */
    filter: brightness(100%);
}
.maxButton{
    max-width: 150px;
}
.GeneraliInfo{
    border-bottom: 1px solid var(--color-neutral-10);
    min-height: 270px;
}


/*-----------------------------------------------------*/
/*Cover Table*/
/*-----------------------------------------------------*/

.CoberturaHeader{
    background-color: var(--color-terciary);
    height: 30px;
    padding-top: var(--space-xs);
    border-left: 0.5px solid;
    border-color: var(--color-neitral-0);
    color: var(--color-neutral-0);
    font-weight: var(--font-bold);
    text-align: center;
}
.OpcaoHeader{
    background-color: var(--color-terciary);
}
.CoberturaRow{
    text-align: center;
    background-color: var(--color-neutral-G14);
    border-left: 0.5px solid;
    border-color: var(--color-white);
    text-align: left;
    color: var(--color-neutral-10);
    font-weight: var(--font-regular);
}
.CoberturaNome_Wrapper{
    height: 11px;
}
.CapitalRow {
    background-color: var(--color-neutral-2);
    border-left: 0.5px solid;
    border-color: var(--color-white);
    text-align: left;
    color: var(--color-neutral-10);
    font-weight: var(--font-regular);
    text-align: center;
}
.OPCAO_Column{
    position: relative;
    bottom: 3px;
    right: 6px;
}

.CoberturaOpcao{
    background-color: var(--color-neutral-3);
    height: 30px;
    border-left: 0.5px solid;
    border-color: var(--color-white);;
    text-align: center;
    color: var(--color-neutral-10);
    font-weight: var(--font-regular);
}

.BlanckSpace_Cobertura{
    height: 10px;
}

.BlankSpace_Check{
    height: 3px;
}

.PremiosTotais{
    background-color: var(--color-neutral-4);
}

/*Responsive*/

.minWidthTitleLabel{
    min-width: 100px;
    margin-right: var(--space-xs);
}

.maxWidthInput{
    max-width: 20vw;
}
.flexContainer{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.simpleLabel{
    height: 35px;
    text-align: left;
    vertical-align: middle;
    min-width: 135px;
}

.input_CodPostal1{
    max-width: auto;
}

.input_CodPostal2{
    max-width: auto;
}

.N_CartaConducao{
    top: 0;
    position: relative;
}
.Codigo_Postal_label{
    position: relative;
    bottom: var(--space-none);
}

.Contacto_Telefonico_label{
    position: relative;
    top: var(--space-s);
}

.inputSexo_Container{
    position: relative;
    right: var(--space-base);
}

.phone input[type="date"]{
    min-width: 155px;
}

.TabeladePrecos_Wrapper{
    width: 670px;
    overflow-x: auto;
}

TableWrapper{
    overflow-x: auto;
}

.TouchIcon{
    display: none;
    text-align: center;
    animation: TouchIcon 3s linear infinite;
    position: absolute;
    left: 220px;
    opacity: 70%;
    padding-bottom: var(--space-xxl);
}

@keyframes TouchIcon {
  50% {
    opacity: 0;
  }
}


/*Media Queries*/
@media (max-width: 420px){
    .text-align-right{
        text-align: left;
    }
}

@media screen and (max-width: 920px) {
  .TouchIcon {
    display: block;
  }
}

@media (max-width: 765px){
    .MainPopup {
    position: absolute;
    left: 20px;
    right: 20px;
    }
}

/*Dívida Técnica*/
.ProdutosEncomenda_CodPostal1 {
    max-width: 85px;
}
.ProdutosEncomenda_CodPostal2 {
    max-width: 65px;
}
.PremiosTotaisAnuais {
   font-size: 11px;
   line-height: 60px; 
}
TableWrapper {
    width: 486px;
    overflow-x: auto;
}
.input-60 {
    width: 60px;
}
.input-100 {
    width: 100px;
}
.input-120 {
    width: 120px;
}
.input-150 {
    width: 150px;
}
.input-200 {
   width: 200px; 
}

.opcao-table {
    width: 65px;
}
.background-color-table {
    background-color: var(--color-terciary);
}
.line-height30 {
    line-height: 30px;
}
.min-height-30 {
    height: 30px;
}