/**
 * /design/css/gmt-general.css
 *
 *
 *
 * This file is to be used for general styles that may be used across multiple pages.
 *
 *
 */
 .bg-tan {
  background-color: #CC9F4F;
}
.bg-black {
  background-color: #212121;
}
.bg-pink {
  background-color: #EB28AF;
}
.bg-white {
  background-color: #ffffff;
}
.bg-main {
  background-color: #F4F4F4;
}
.text-white {
  color: white;
}
.container-bg {
  background-color: #F4F4F4;
}
.gmt-main {
  margin-bottom: 50px;
	display:none;
}
.gmt-main-body {
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
.btn-row {
	text-align: center;
	margin-top:25px;
}
.gmt-card {
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 7%), 0 4px 6px -2px rgb(0 0 0 / 5%);
  border-radius: 0.5rem;
  padding: 20px 20px 20px 20px !important;
  margin-bottom: 25px !important;
}

.gmt-container {
  margin-top: 95px;
}

.gmt-container-mobile {
  margin-top: 195px !important;
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.gmt-main-container-row {
  margin-left: 210px !important;
}
.gmt-main-container-row-mobile {
  margin-left: 0px;
}

.gmt-card-title {
  font-size: 1.25rem;
  color: #575757;
  font-weight: 500;
  margin-bottom: 20px;
}
.gmt-card-subtitle {
  font-size: 1.0rem;
  color: #575757;
}
.gmt-form-field {
  margin-top: 20px !important;
}

.gmt-help-button{
	border: none;
	background-color: #fff;
    color: #9F9B9B;
}

.gmt-group-merge-container {
  margin-left: 15px !important;
  padding-right: 25px !important;
}
.submit-group-merge-spinner {
  margin-right: 10px;
}


/************************  START OF MODAL WINDOW DEFAULT STYLES  ************************************/

.modal-footer{
	justify-content: center !important;
}

.modal-title1{
	font-weight: 500;
	margin-bottom: 0;
    line-height: 1.6;
	display: block;
	color: #575757;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-size: 20pt;
}

.modal-title1{
	font-weight: 500;
	margin-bottom: 0;
    line-height: 1.6;
	display: block;
	color: #575757;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-size: 16pt;
}

.modal-mom-in {
    border: 1px solid #000000;
	border-bottom-left-radius: 0.5rem;
	border-top-left-radius: 0.5rem;
	border-bottom-right-radius: 0rem;
	border-top-right-radius: 0rem;
	background-color: #fff;
    position: relative;
    overflow-y: scroll;
    height: 100px;
	margin-bottom: 25px;
}

.modal-mom-all {
    border: 1px solid #000000;
	border-bottom-left-radius: 0.5rem;
	border-top-left-radius: 0.5rem;
	border-bottom-right-radius: 0rem;
	border-top-right-radius: 0rem;
    background-color: #fff;
    height: 300px;
    margin-top: 20px;
    padding: 10px;
    overflow-y: scroll;
}

.modal-container-pad{
	padding-left: 15px;
}

.gmt-modal-add{
	margin-top: 20px;
}
.headline-text {
  font-family: Futura, Futura-Medium, "Futura Medium", "Century Gothic", CenturyGothic, "Apple Gothic", AppleGothic, "URW Gothic L", "Avant Garde", sans-serif;
}

.gmt-modal-clear{
	margin-bottom: 10px;
}

.gmt-card-min-width{
	min-width: 280px;
}


/************************  END OF MODAL WINDOW DEFAULT STYLES  ************************************/


/************************* CHIP STYLES **********************************/
.chip {
	max-height: 32px !important;
	max-width: 160px !important;
	min-width: 160px !important;
	border: solid 1px #ccc !important;
	border-radius: 0.5rem !important;
	background-color: #ffffff !important;
	margin-right: 5px!important;
}

.chip img {
	width: 30px !important;
    height: 30px !important;
    border-radius: 0.5rem !important;
    margin-left: -12px !important;
    margin-top: -2px !important;
    margin-right: 5px !important;
}
.chip-initial-avatar {
   	height: 30px;
	width:30px;
    border-radius: 0.5rem;
    background-color: #CCCCCC;
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
    color: black;
	margin-left: -12px;
	margin-top: -2px;
	margin-right:5px;
	display: inline-flex
}

.chip-md {
	max-height: 40px !important;
	max-width: 300px !important;
	width: 100% !important;
	border: solid 1px #ccc !important;
	border-radius: 0.5rem !important;
	background-color: #ffffff !important;
	margin-right: 5px!important;
}

.chip-md img {
	width: 40px !important;
    height: 40px !important;
	min-width: 40px;
    border-radius: 0.5rem !important;
    margin-left: -12px !important;
    margin-top: -5px !important;
    margin-right: 5px !important;
}
.chip-md-initial-avatar {
   	height: 40px;
	width:40px;
	min-width: 40px;
    border-radius: 0.5rem;
    background-color: #CCCCCC;
    font-size: 14pt;
    font-family: Arial, Helvetica, sans-serif;
    color: black;
	margin-left: -12px;
	margin-top: -5px;
	margin-right:5px;
	display: inline-flex
}

.medium-profile{
	height: 42px;
	font-size: 14pt;
    font-family: Arial, Helvetica, sans-serif;
	color: #000000;
}

.small-profile{
	height: 32px;
}

.modal-mom-name{
	font-size: 11px;
	color:#000000 !important;
	
}

.modal-chip-name-container{
	max-width: 105px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;	
}
.chip-md-name-container{
	max-width: 240px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;	
}


/*********************** HIJACKING THE MDB BOOTSTRAP TO MAKE FORM FIELDS HAVE PINK *********************/

.form-outline .form-control:focus ~ .form-label {
	color: #EB28AF !important
}
.form-outline .form-control:focus ~ .form-notch .form-notch-middle {
	border-color: #1266f1;
	border-bottom-color: #EB28AF !important;
	box-shadow: 0 1px 0 0 #EB28AF !important;
}
.form-outline .form-control:focus ~ .form-notch .form-notch-leading {
	border-color: #EB28AF !important;
	box-shadow: -1px 0 0 0 #EB28AF, 0 1px 0 0 #EB28AF, 0 -1px 0 0 #EB28AF !important
}
.form-outline .form-control:focus ~ .form-notch .form-notch-trailing {
	border-color: #EB28AF !important;
	box-shadow: 1px 0 0 0 #EB28AF, 0 -1px 0 0 #EB28AF, 0 1px 0 0 #EB28AF !important
}


.form-select:focus {
  border-color: #EB28AF !important;
  /*outline: 0;*/
  box-shadow: inset 0 0 0 1px #EB28AF !important
}
.form-check-input:checked {
  border-color: #EB28AF !important
}
.form-check-input:checked:focus {
  border-color: #EB28AF !important
}
.form-check-input:checked:focus:before {
  box-shadow: 0 0 0 13px #EB28AF !important;
  /*transform: scale(1);
  transition: box-shadow .2s, transform .2s*/
}
.form-check-input:indeterminate:focus:before {
  box-shadow: 0 0 0 13px #EB28AF !important
}
.form-check-input[type=checkbox]:checked {
  /*background-image: none;*/
  background-color: #EB28AF !important
}
.form-check-input[type=checkbox]:checked:focus {
  background-color: #EB28AF !important
}
.form-check-input[type=checkbox]:indeterminate {
  border-color: #EB28AF !important
}
.form-check-input[type=radio]:checked:after {
  border-color: #EB28AF !important;
  background-color: #EB28AF !important;
}
.form-switch .form-check-input:checked:focus:before {
  box-shadow: 3px -1px 0 13px #EB28AF !important;
}
.form-switch .form-check-input:checked[type=checkbox]:after {
  background-color: #EB28AF !important;
}
.input-group > .form-control:focus {

  border-color: #EB28AF !important;
  box-shadow: inset 0 0 0 1px #EB28AF !important;
}
.datepicker-cell.selected .datepicker-cell-content {
  background-color: #EB28AF !important;
}
.buttons-container {
    background-color: #EB28AF !important;
}
.timepicker-head {
  background-color: #EB28AF !important;
}
.timepicker-time-tips-hours.active, .timepicker-time-tips-inner.active, .timepicker-time-tips-minutes.active {
    
    background-color: #EB28AF !important;
}
.timepicker-hand-pointer {
    background-color: #EB28AF !important;
}
.timepicker-circle {
    border: 14px solid #EB28AF !important;
}
.timepicker-middle-dot {
    background-color: #EB28AF !important;
}
.timepicker-button {
	color: #EB28AF !important
}
.timepicker-button.timepicker-submit.timepicker-submit-inline
{
  color: #FFFFFF !important
}
.datetimepicker-toggle-button:focus, .datetimepicker-toggle-button:hover, .timepicker-input:focus + .timepicker-toggle-button, .timepicker-input:focus + .timepicker-toggle-button i, .timepicker-toggle-button:focus, .timepicker-toggle-button:hover {
  color: #EB28AF !important
}
.datetimepicker-toggle-button:focus, .datetimepicker-toggle-button:hover {
  color: #EB28AF !important
}
.datepicker-header {
  background-color: #EB28AF !important
}
.datepicker-toggle-button:focus, .datepicker-toggle-button:hover {
  color: #EB28AF !important
}
.datepicker-footer-btn{
	color: #EB28AF !important
}
.select-input.focused ~ .select-arrow {
  color: #EB28AF !important
}
.select-clear-btn:focus {
  color: #EB28AF !important;
}
.select-input.focused ~ .select-label {
  color: #EB28AF !important
}
.select-input.focused ~ .form-notch .form-notch-leading {
  border-top: 2px solid #EB28AF !important;
  border-bottom: 2px solid #EB28AF !important;
  border-left: 2px solid #EB28AF !important;
}
.select-input.focused ~ .form-notch .form-notch-middle {
  border-bottom: 2px solid;
  border-color: #EB28AF !important;
}
.select-input.focused ~ .form-notch .form-notch-trailing {
  border-color: currentcolor currentcolor currentcolor #EB28AF !important;
  border-bottom: 2px solid #EB28AF !important;
  border-right: 2px solid #EB28AF !important;
  border-top: 2px solid #EB28AF !important;
}
.select-input.focused ~ .select-arrow {
  color: #EB28AF !important
}
.loading-spinner {
  color: #EB28AF !important;
}

.gmt-primary-button {
  	background-color: #EB28AF !important;
  	color: white !important;
	  margin-left: 10px !important;
	  height: 35px !important;
	padding: 0.625rem 1.5rem 0.5rem !important;
}

.gmt-secondary-button {
  	background-color: #CC9F4F !important;
  	color: white !important;
	margin-left: 10px !important;
	height: 35px !important;
	padding: 0.625rem 1.5rem 0.5rem !important;
}

.gmt-secondary-button:hover {
	border: none;
}

.gmt-button-upper-right {
    float: right;
}

.gmt-card-button {
	margin-top: 15px;
}

.btn-outline-danger {
  padding-top: 7.5px !important;
  padding-bottom: 5.5px !important;
}

.gmt-row {
    margin-top: 15px !important;
}

.invalid-feedback{
	margin: 20px;
}
.error {
   border-color: #F93154;
}

.error-label {
   color: #F93154;
}

.stepper-active .stepper-head-icon {
	background-color: #EB28AF !important;
}

.stepper-completed .stepper-head-icon {
    background-color: #CC9F4F !important;
}

.form-control{
	margin: 0px !important;
}

.gmt-form-input {
  margin-bottom: 17px;
}