/*========== 
Custom Styling
===============*/
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
/*font override*/
body, html, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6  {
  font-family: 'Lato', sans-serif !important;
}
form, input, legend, button, textarea, label, ::placeholder{
  font-family: 'Lato', sans-serif !important;
}
.footer .footer-bottom p.smallText {
  font-family: 'Lato', sans-serif !important;
}

/*do not customize navbar font... its removing the icons*/
/* .navbar-static-top.navbar .menu-bar > .navbar-nav > li > a {
  font-family: 'Lato', sans-serif;
} */

/*As pe figma, footer is slim and is moving to middle for short content pages. Hence moving it to fixed.
Because of this page padding needs to be added*/
.footer {
  position: fixed;
  width: 100%;
  bottom: 0;
  height: unset !important;
  z-index: 100;
  
}
/*fix for footer: fixed*/
#mainContent{
  padding-bottom: 50px;
}
/*Footer bg, color and height*/
.footer .footer-bottom {
  background: #222222 !important;
  color: var( --portalThemeColor7) !important;
  padding: 8px 5px !important;
  min-height: unset !important;
}

.footer .footer-bottom p.smallText {
  color: #fff !important;
  font-size: 1.3rem !important;
  line-height: 2rem !important;
}


/* removes the border from top of the actions button */
 .crmEntityFormView .actions {
  border-top: none;
}

/* Page bg is greyish and form bg is white.. */
.crmEntityFormView {
  border: 1px solid rgba(0, 0, 0, 0.25) !important;
  border-radius: 0px;
  padding: 20px 10px;
  background-color: white !important;
}
/*for requests page*/
/*check this below class.. or add your own class*/
.entitylist-filter{
  border: 1px solid rgba(0, 0, 0, 0.25) !important;
  border-radius: 0px !important;
  background:  white !important;
}
.entity-grid{
  border: 1px solid rgba(0, 0, 0, 0.25) !important;
  border-radius: 0px !important;
  background:  white !important;
}
 .entitylist{
  border-radius: 0px !important;
  border: 0 !important;
}
.entitylist .entity-grid{
  border-radius: 0px !important;
  border:  1px solid rgba(0, 0, 0, 0.25) !important;
  padding-top: 20px !important;
  padding-right: 20px !important;
  padding-left: 20px !important;
} 
.entitylist .panel-body{
  background-color: white !important;
}

/*apply button in my requests page*/
.btn-default{
  background-color: var(--portalThemeColor1) !important;
  color: var(--portalThemeColor7) !important;
}
.btn-default:hover{
  background-color: var(--portalThemeColor7) !important;
  border: 1px solid var(--portalThemeColor1) !important;
  color: var(--portalThemeColor1) !important;
}



/*Navigation drop down fix*/
html[dir=ltr] li a{
  margin-left: 0 !important;
}

/*drop downs requests page*/
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus{
  background-color: var(--portalThemeColor1) !important;
  color: var(--portalThemeColor7) !important;
}

/*navbar extra width fix*/
.navbar-right{
  margin-right: 0px !important;
}

/*Button*/ 
.button, .btn-primary {
  background: var(--portalThemeColor1) !important;
  color: white !important;
}
.button:hover,  .btn-primary:hover {
  background: #fff !important;
  color: var(--portalThemeColor1) !important;
  border: 1px solid var(--portalThemeColor1) !important;;
} 



.view-grid > table > thead > tr > th > a {
  color: var(--portalThemeColor1) !important;
  font-size: 1.5rem;
  font-weight: bold;
}

.view-grid > table > tbody > tr > td {
  color: var(--portalThemeColor4) !important;
  font-size: 1.4rem;
}


/*action buttons margin from top form*/
.actions{
  margin-top: 20px !important;
}

/*alert status display*/
.alert-info{
  background-color: #fafafa;
  border-color: rgba(0, 0, 0, 0.25);
  color: #000;
  padding: 25px 30px;
  font-weight: bold;
}
.alert-info .btn-info{
  background-color: #e40048;
  /* padding: 10px; */
}

.alert-success{
  background-color: #007238;
  color: #fff;
}
.alert-success .close{
  text-shadow: none;
  color: white;
  opacity: 1;
}

.alert-warning {
  background: rgba(0, 0, 0, 0.10) ;
  border-color: transparent;
  color: #000;
}

.alert-danger{
  border: 1px solid  rgba(0, 0, 0, 0.25);
background:#fafafa;
font-weight: bold;
}

.validation-summary a{
  color: #E4004B !important;
  font-weight: bold;
}

/*profile page left side panels*/
.panel-default > .panel-body, .list-group-item {
  background-color: white !important;
}
.profile-info{
  background-color: white !important;
}
/*remove border from payment table*/
html[dir=ltr] .crmEntityFormView .cell.crmquickform-cell:first-child{
  border-right: 0;
}
/*
.view-grid > table > thead > tr > th > a {
  color: black !important;
}

.btn-primary {
  background-color: black !important;
  color: white !important;
} */


/*Pagination*/
/*fix for pagination*/
.pagination{
  width: 100%;
}
.pagination > li > a, .pagination > li > span{
  width: 42px;
  height: 42px;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover{
  background-color: var(--portalThemeColor1) !important;
  text-decoration: none !important;
  color: var(--portalThemeOnColor1) !important;
}
/* .pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > a:focus, .pagination > .active > span, .pagination > .active > span:hover, .pagination > .active > span:focus{
  display: flex;
  align-items: center;
  justify-content: center;
} */

.pagination > li > a, .pagination > li > span{
  color: var(--portalThemeColor1) !important;
  font-weight: bold !important;
}

/*Increase the container size to accomodate table headers in 1 line*/
@media (min-width: 1200px){
  .container {
    width: 1250px;
  }
}
@media (max-width: 767px) {
  .navbar-header {
    margin-top: 15px;
  }
}

/*Requests page Popup > Status text*/
.crmEntityFormView .state, .crmEntityFormView .status{
  padding-left: 0px !important;
}


/*find addrress PCF control button override*/
/* class purplebutton is for powerpages*/
/*class crm button is for the crm website*/
.purplebutton{
  background-color: var(--portalThemeColor1) !important;
  color: #fff !important;
}
.purplebutton:hover{
  background-color: white !important;
  border: 1px solid var(--portalThemeColor1) !important;
  color: var(--portalThemeColor1) !important;
}


/*Brand name*/
/*should be managed like this, assigning from settings is changing the theme title color*/
h1.siteTitle, .navbar-static-top.navbar-inverse .navbar-brand a h1.siteTitle, .navbar-static-top.navbar-inverse .navbar-brand a h1.siteTitle > span{
  color: white !important;
}

/*Payment response*/
.paymentResponse{
  border: 1px solid  rgba(0, 0, 0, 0.25);
  border: 1px solid  rgba(0, 0, 0, 0.25);
  background:  #FFF;
}

.paymentResponse .paymentHeading{
  font-size: 2.2rem;
  font-weight: bold;
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
  padding-bottom: 10px;
  color: #000;
}

.paymentResponse .glyphicon-ok-sign{
  color:#007238;
}
.paymentResponse .glyphicon-remove-sign{
  color:#E4004B;
}

.paymentResponse .paymentMessage{
  color: black;
  font-weight: 1.8rem;
  padding: 3rem 0;
}
.paymentResponse .paymentMessage span{
  font-weight: bold;
}

.paymentResponse .paymentFooterButtons{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 15px;
}


/*Radio buttons in order a bin*/
.picklist.horizontal{
  display: flex;
}

.crmEntityFormView .cell .picklist label{
  margin-right: 20px !important;
  cursor: hand !important;
}


/*Requests page search top right*/
.pull-right.toolbar-actions .input-group-btn{
  border: 1px solid var( --portalThemeColor1) !important;
}

.pull-right.toolbar-actions .input-group-btn button{
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-color:var( --portalThemeColor1) !important;
}

.pull-right.toolbar-actions .input-group-btn .btn-default:hover{
  border: 1px solid var(--portalThemeColor1) !important;
}



.ui-dialog{
  top: 100px !important;
}