@import url("/OutSystemsUIWeb/Theme.BaseTheme.css?897");

/* ================================================
Root Element Section
  ================================================ */
:root {
    --color-primary: #0064b0; /*primary-color*/
    --color-primary-hover: #0064b0; /*primary-color*/
    --color-secondary: #0064b0; /*primary-color*/
    --space-base: 5px !important;
    --color-neutral-6 : #000 !important;
    --space-l: 15px !important;
}

body {
    color: #5C656D;    
}

.layout .main {
    padding-top: 0px !important;
}

.layout .header {
    position: -webkit-sticky !important;
    position: sticky !important;
}

.MainPopup { 
    overflow:hidden !important; 
}

.content {
    position: sticky !important;   
}

.content-top {    
    height: 45px;    
    background-color: #FFFFFF !important;    
    margin-top: 5px;
}

.ThemeGrid_Container {
    margin-top: 1px !important;
    margin-bottom: 10px;
    position: -webkit-sticky !important;
    position: sticky !important;
    max-width: 1600px !important;
}

.tabs-header-item.active a {
    color: #343A40 !important;
}

.tabs-header-item a {
    color: #868E96 !important;
}

.checkbox[disabled="disabled"]:before {
    background-color: #a09a9a !important;
}

.tabs-header-item {
    padding: 0 0 0 0 !important;
}



.normalInput{
        background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
    border: var(--border-size-s) solid var(--color-neutral-5);
    color: var(--color-neutral-9);
    font-size: var(--font-size-s);
    height: 40px;
    padding: var(--space-none) var(--space-base); 
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
    text-transform: none !important;
}

.Form textarea[readonly]{
    background-color: rgb(241, 243, 245) !important;
}

.Form input[readonly]{
    background-color: rgb(241, 243, 245) !important;
}

.Form select[disabled]
{
    background-color: rgb(241, 243, 245) !important;
}

/* Supported in Blink/WebKit/Edge without a prefix */
input:read-only {
  background-color: rgb(241, 243, 245) !important;
}

/* Supported in Blink/WebKit/Edge without a prefix */
select[readonly] {
  background-color: rgb(241, 243, 245) !important;
}

.selectReadOnly {
  background-color: rgb(241, 243, 245) !important;
}

.tabs .tabs-content
{
     padding-top: 5px !important ;
}

.tabs .tabs-content .tabs-content-item
{
    padding-top: 0px !important ;
}

.input
{
    height: 35px !important ;
}

.select
{
    height: 35px !important ;
}
.ccyLabel
{
    padding: 5px 0px 5px 0px !important;
}

@media only screen and (max-width: 900px) {
    .phone .content-top {
        -ms-flex-direction: row;
        flex-direction: row;
    }
}

/* ================================================
    Nav Style Section
  ================================================ */

.navDiv  {
    display: inline-block;           
    font-size: 26px;    
    font-weight: 400;
    height: 45px;
    margin: 20px 0px 0px 0px ; /* top right bottom left */
    line-height: 32px;    
}

.navDiv a {
    color: #868E96 !important;
}

.selectedNavDiv {    
    display: inline-block;           
    font-size: 26px;
    font-weight: 600;
    height: 45px;
    margin: 20px 0px 0px 0px ; /* top right bottom left */
    line-height: 32px;
    border-bottom: 2px solid;
    border-color: #0064b0;    
}

.selectedNavDiv a {
    color: #000 !important;
    border-color: #3badef;
}

.wizard-item-icon {
    width: 60px;
    height: 60px;
}

.wizard-label {
    font-size: 22px;   
}

.wizardContentDiv {
    padding: 10px 30px 20px 30px;   
}

.wizard-item.past .wizard-item-icon a {
    color: white;   
}

/* ================================================
    Button Style Section
  ================================================ */
.btnStyle {
    display: inline-block !important;   
    width: 90px;
}

.btnStyle120 {
    display: inline-block !important;   
    width: 120px;
}

.btnStyle160 {
    display: inline-block !important;   
    width: 160px;
}

.btnStyle200 {
    display: inline-block !important;   
    width: 200px;
}

.actionBtn  {
    float: left !important;   
    margin-left: 20px;
}

.submitBtn {
    background-color: #0064b0 !important;
    color: white !important;    
}

.exportBtn {
    background-color: green !important;
    color: white !important;
}

.longEditButton {
    height: 32px;
    width: 150px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

.editButton {
    height: 32px;
    /* width: 82px; */
    /* Edit start */
    width: fit-content;
    padding: 0 8px;
    /* Edit end */
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

.groupBtn {
    display: flex;
    justify-content: flex-end;
}

.editButton60 {
    height: 32px;
    width: 60px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

.editButton90 {
    height: 32px;
    width: 90px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

.editButton120 {
    height: 32px;
    width: 120px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
    display: inline-block;
}

.editButton150 {
    height: 32px;
    width: 150px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
    display: inline-block;
}

.docButton {
    vertical-align: middle;
    height: 32px;
    width: 32px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 8px;
    font-weight: 600;
    text-align: center;    
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
    display: inline-block;    
    margin-right: 8px;
}

.docButton120 {
    vertical-align: middle;
    height: 32px;
    width: 150px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 10px;
    font-weight: 600;
    text-align: center;    
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
    display: inline-block;    
    margin-right: 8px;
}

.printButton {
    height: 32px;
    width: 90px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

.smallButton {
    height: 32px;
    width: 32px;
    border-radius: 4px;
    background-color: #E9ECEF;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #0062B4;
    border-style: solid;
    border-width: 1px;
}

/* ================================================
    Other Common Section
  ================================================ */
.paramDiv {
    margin-top: 4px;   
}

.pageTitleMainDiv {    
    position: relative;
    width: 800px;
    min-height: 60px;    
}

.backDiv {
    height: 30px;    
    width: 132px;    
    color: #0062B4;        
    font-size: 14px;    
    font-weight: 600;    
    line-height: 16px;
    position: absolute;    
}

.pageTitleDiv {    
    position: absolute;
    margin-top: 20px;
    margin-left: 0px !important;
    width: 700px;
}

.captionDiv {
    height: 27px;    
    width: 182.92px;    
    color: #343A40;    
    font-family: "SF Pro Display";    
    font-size: 22px;    
    line-height: 27px;
}

.formDiv {
   width:800px !important;   
   margin-top: 15px; 
}

.longFormDiv {
   width:100% !important;   
   margin-top: 15px; 
}

.LabelTxt {
    font-weight: bold;
    font-size: 14px;
}

.filterInput {
    width: 200px !important;    
}

.filterTitle {
    width: 84px !important;        
}

.filterCombo {
    width: 200px !important;
}

.filterDiv {
    margin-top: 20px;   
}

.alignRightDiv {
    text-align: right !important;   
    vertical-align: middle;
}

.alignCenterDiv {
    text-align: center !important;   
    vertical-align: middle;
}

.alignVCenterDiv {    
    vertical-align: middle;
}

.inlineDiv {
    display: inline-block;
}

.newForm {
    margin-top: 20px;
    box-sizing: border-box;    
    border: 1px solid #DEE2E6;
    border-radius: 6px;
    background-color: #FFFFFF;    
    box-shadow: 0 22px 64px 0 rgba(0,0,0,0.1);
}

.popupDiv {
    margin-left: 15px;   
    margin-top: 15px;    
}

.popupTitleDiv {
    height: 32px;
    width: 298px;
    color: #15181A;
    font-size: 26px;
    font-weight: 600;
    line-height: 32px;
    display: inline;
    margin-bottom: 20px;
}

.popupReminderDiv {
    margin-top: 10px;
    margin-bottom: 10px;
}

.topLabel {
    display: block;
    width: 300px !important;
    margin-left: 0px !important;
    padding-left: 0px !important;
}

.belowLabelInput {
    margin-left: 0px !important;
    padding-left: 0px !important;
    width: 400px !important;
}

.sectionSeparator {
    height: 1px;
    background-color: #DEE2E6;
    margin-top: 10px;
    margin-bottom: 10px;
}

.SearchContainerDiv {    
    width: 100%;    
    border: 1px solid #DEE2E6;    
    border-radius: 4px;    
    background-color: #F3F6F8;
    padding: 20px;
    margin-top: 10px;    
    margin-bottom: 10px;    
}

.NumericInput
{
    text-align: right !important;
}


/* Contract Status: Draft - Light Blue*/
.ContractStatusDraft {
    height: 24px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #4e81a3;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}

/* Contract Status: New - Orange*/
.ContractStatusNew {
    height: 24px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #ef6413;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}


/* Contract Status: Pending Approval - Red*/
.ContractStatusPendingApproval {
    height: 48px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #D96A6A;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}

/* Contract Status: In Progress - Blue*/
.ContractStatusInProgress {
    height: 24px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #134ae2;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}

/* Contract Status: Completed - Green*/
.ContractStatusCompleted {
    height: 24px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #078f1d;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}

/* Contract Status: Rejecteded - Black*/
.ContractStatusRejected {
    height: 24px;
    width: 100px;
    border: 1px solid;
    border-radius: 45px;
    color: #000;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    text-align: center;
    padding: 2px 2px 25px 2px;
}

.EscapeCapital
{
    
}

.DoubleLine
{
    height: 60px !important ;
}

.TableRecords_Header {
    background-color: #798585 !important;   
    color: #FFFFFF !important;
}

.TableRecords {
    color: #000000 !important; 
}

.TableRecords_EvenLine {
    background-color: #e3edfc !important;   
}

/*Cell Padding*/
.TableRecords .TableRecords_OddLine,
.TableRecords .TableRecords_EvenLine {
    padding: 0px 5px 0px 5px;
}

.TableRecords .TableRecords_Header{
    padding: 0px 5px 0px 5px;
}

.verticalAlignCenter{
    align-items: center;
    display: flex;
}
.adjusted-count {
    background-color: var(--color-neutral-0);
    min-height: 50px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}