@media screen and (max-width: 600px) {
    .title-text-box {
        display: none;
    }
}

.fa-awesome-face1::before {
    content: "";
    display: block;
    width: 100%; /* Set width to 100% to span the full width */
    height: 90px; /* Keep the height as needed */
    background-size: cover; /* Make sure the image covers the entire width and height */
    background-repeat: no-repeat; /* Prevent the background from repeating */
    background-position: center; /* Center the background image */
    margin: auto;
    margin-top: 5px;
}

.fa-awesome-face::before {
    content: "";
    display: block;
    width: 100%; /* Set width to 100% to span the full width */
    height: 20px; /* Keep the height as needed */
    background-size: contain; /* Ensure the whole image is visible */
    background-repeat: no-repeat; /* Prevent the background from repeating */
    background-position: left; /* Center the background image */
    margin: auto;
}


.fa-awesome-face {
   width: 100% !important;
   height: 20px !important;
}

#t_MenuNav_0 {
    background: white;
    display: none;
}

#t_MenuNav_0:hover {
    background: white;
}

/***************************************************************************************/

.apex-cal-red { 
  background-color: #d9534f !important; 
  color: white !important; 
}     

.apex-cal-cyan { 
  background-color: #00bcd4 !important; 
  color: black !important; 
}     

.apex-cal-blue { 
  background-color: #007bff !important; 
  color: white !important; 
}    

.apex-cal-bluesky { 
  background-color: #81d4fa !important; 
  color: black !important; 
} 

.apex-cal-darkblue { 
  background-color: #0056b3 !important; 
  color: white !important; 
} 

.apex-cal-green { 
  background-color: #2e7d32 !important; 
  color: white !important; 
}    

.apex-cal-yellow { 
  background-color: #fbc02d !important; 
  color: black !important; 
}  

.apex-cal-silver { 
  background-color: #c4e0e5 !important; 
  color: black !important; 
}    

.apex-cal-brown { 
  background-color: #6d4c41 !important; 
  color: white !important; 
}  

.apex-cal-lime { 
  background-color: #aeea00 !important; 
  color: black !important; 
}     

.apex-cal-white { 
  background-color: #fafafa !important; 
  color: black !important; 
}   

.apex-cal-gray { 
  background-color: #bdbdbd !important; 
  color: black !important; 
}     

.apex-cal-black { 
  background-color: #333333 !important; 
  color: white !important; 
}   

.apex-cal-orange { 
  background-color: #ff5722 !important; 
  color: white !important; 
}    

/***************************************************************************************/

* {
     font-family: "Poppins", sans-serif;
}

/***************************************************************************************/


#title-container {
    display: flex;
    align-items: center; 
    line-height: 1;
    opacity: 0;
}

@keyframes fallFromSky {
  0% {
    opacity: 0;
    transform: translateY(var(--start-offset)); 
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

.title-text-box {
    font-size: 16px; 
}



/***************************************************************************************/



.t-Header-branding {
  background-color: white !important;
}

/***************************************************************************************/


#t_PageBody {
    background: rgb(255, 255, 255);
}

.bar-main-title {
    color: black;
    padding-left: 5px;
}

.t-NavigationBar-item {
    color: black;
}

:root {
    --ut-link-text-color: rgb(97, 97, 97);
    --ut-tabs-item-active-highlight-color: var(--box-color);
}

[id^="apex_dialog_"]  {
	background: linear-gradient(-45deg, #d3d3d3, #ffffff, #d3d3d3, #ffffff);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
	height: 100vh;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.not-filled {
    border-color: rgb(224, 20, 20);
}


#selDate1 {
    z-Index: 10;
}

@media screen and (max-width: 600px) {
    .a-IRR-searchFieldContainer {
        max-width: 200px !important;
        /* Any other styles specific to mobile devices */
    }
}

#P0_IMPERSONATING_ON_DISPLAY {
    background: orange;
}

.inputmask-integer {
    text-align: left !important;
}

.inputmask-decimal {
    text-align: left !important;
}


.t-Form-label {
    font-size: 13px;
    animation: fadeIn2 0.5s ease-in-out forwards; 
}

.apex-item-display-only,
.apex-item-textarea,
.a-Switch,
.apex-item-option {
    animation: fadeIn2 0.5s ease-in-out forwards; 
}

.apex-item-select:not(.apex-item-has-icon) {
    animation: fadeIn2 0.5s ease-in-out forwards; 
}

.apex-item-text:not(.apex-item-has-icon) {
    animation: fadeIn2 0.5s ease-in-out forwards; 
}

.t-Region-title,
.my-title {
    animation: fadeIn2 0.5s ease-in-out forwards;
}

.apex-rds-container, .a-RDS-container {
    animation: fadeIn2 0.5s ease-in-out forwards;
}

/* Animation */
@keyframes fadeIn2 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.flex-align {
  display: flex;
  align-items: center;
}

#t_Body_title {
    border-bottom-width: 0px;
}

#P0_FAVORITES {
    width: 15px;
    opacity: 0.2;
    background-size: var(--a-field-select-background-size,2rem 1rem);
    background-image: unset;
    background-position: right center;
    background-repeat: no-repeat;
    -webkit-padding-end: unset;
    padding-inline-end: unset;
    border-radius: 8px;
}

 #P0_FAVORITES1 + span {
     color: white;
 }

#P0_FAVORITES1 > .apex-item-icon.fa.fa-star {
    color: white;
}

/*****************************/

.t-MegaMenu-label {
    font-size: 15px !important;
}

/*****************************/
/* Transaction **/

#info-message {
    display: flex;
    align-items: center;
    padding: 5px;
    font-weight: bold;
    background: #eee;
    position: absolute;
    width: 100%;
}

.fa-active {
    color: rgb(53, 117, 177);
}

.fa-inactive {
    color: #888;
}

.fa-success {
    color: rgb(11, 128, 11);
}

.fa-failure {
    color: rgb(192, 35, 35);
}

/*****************************/

.regionBorder {
    border: solid rgb(230, 230, 230) 1px;
}

.speech-bubble {
    margin-top: 5px;
    display: inline-block;
    position: relative;
    max-width: 30em;
    background-color: rgb(255, 255, 255);
    padding: 18px 24px;
    font-size: 14px;
    border-radius: 1rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2), 0 1px 3px rgba(0, 0, 0, .1);
}

.a-IRR-noDataMsg-icon {
    display: none;
}

/*****************************/

.t-Form-fieldContainer.t-Form-fieldContainer--floatingLabel > .t-Form-inputContainer >  .t-Form-itemWrapper > .display_only.apex-item-display-only {
    border: solid 1px #eee;
    font-size: 1em;
}

.activity-full {
    background: pink;
    padding: 2px 6px; 
    border-radius: 6px;
    color: black;
}

.activity-available {
    background: lightgreen;
    padding: 2px 6px; 
    border-radius: 6px;
    color: black;
}

.select-plain {
    color: #eee;
}

.select-activity {
    padding: 1px;
    background: white;
    border: solid 2px rgb(0, 0, 0); 
    border-radius: 50%;
}

.select-success {
    color: green;
}

.select-full {
    background: orangered;
    color: white;
}

.select-wait-list {
    background: orange;
    color: white;
}

.fa-hover:hover {
    box-shadow: 0px 0px 3px rgb(78, 70, 99); 
}


.fa-hoverX:hover {
    background: rgb(255, 255, 255);
    border-radius: 50%;
    box-shadow: 0px 0px 2px rgb(172, 172, 172); 
}

/****************************/

.modern-container {
  background: linear-gradient(135deg, #667eea, #764ba2);
  border-radius: 6px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 6px;
  padding-bottom: 6px;
  color: #fff;
  margin-bottom: 4px;
}

/* Optional: Add more styles as needed */

.modern-container h2 {
  font-size: 14px;
  margin-bottom: 8px;
  margin-top: 0px;
}

.modern-container p {
  font-size: 12px;
  line-height: 1.2;
}

.modern-container a {
  color: #ffc107;
  text-decoration: none;
  transition: color 0.3s ease;
}

.modern-container a:hover {
  color: #ffca28;
}


/* Tabs */
.btn-flex span:first-child {
    margin-top: -3px;
    margin-bottom: -3px;
    padding: 3px;
}

@media only screen and (max-width: 600px) {
    .btn-flex span:first-child {
        margin-right: 0px;
    }

    .btn-flex > .t-Button-label {
        display: none;
    }
}


/* Progress bar */
#progressbar {
    position: relative;
    display: flex;
    align-items: center;
    margin: 0px;
    width: 100px;
    height: 24px;
    background: rgb(140,140,140);
    background: linear-gradient(180deg, rgba(140,140,140,1) 0%, rgba(130,130,131,1) 80%, rgba(120,120,120,1) 100%);
    border-radius: 3px;
    padding: 0px;
    text-shadow: 0 0 1px black, 0 0 1px black, 0 0 1px black, 0 0 1px black;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2); 
}

.progressbarInner {
    font-size: 13px;
    height: 24px;
    display: flex;
    align-items: center;
    color: white;
    font-weight: bold;
    border-radius: 3px;
}

.activity-time {
    font-weight: bold;
    margin-bottom: 2px; 
}

.activity-name {
    margin-top: 2px; 
    font-weight: bold; 
}

/* End of Progress bar */


.a-Notification-title.aErrMsgTitle {
    display: none;
}

#t_Alert_Notification > .t-Alert-wrap > .t-Alert-icon {
    display: none !important;
}

#t_Alert_Notification {
    background: #fff;
}

.a-Notification-item.htmldbStdErr::before {
    display: none;
}

.a-Notification-item.htmldbStdErr {
    color: red;
}

/* Nav control and Main bar */
#t_Button_navControl {
    background: #777;
    border-radius: 50%;
}

.t-Header-controls {
    border-radius: 50%;
}

/* Navigation icons */
.t-Button.t-Button--icon.t-Button.t-Button--header.t-Button--navBar {
    border-radius: 20px;
}

/* Navigation bar icons for mobile */
@media only screen and (max-width: 768px) {
    .t-Button.t-Button--icon.t-Button.t-Button--header.t-Button--navBar {
        padding-right: 7px;
        padding-left: 7px;
    }
    ul.t-NavigationBar li.t-NavigationBar-item:last-child .t-Button.t-Button--icon.t-Button.t-Button--header.t-Button--navBar {
        padding-right: 12px;
        padding-left: 4px;
    }
}

span[role="img"].fa {
    background: #333;
    color: white;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
}

span[role="img"].fa:hover {
    background: #666;
}


.fai {
    background: #333;
    color: white;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
}

.fai:hover {
    background: #666;
}

.fai-info {
    background: rgb(205, 228, 245);
    color: black;
    padding: 3px;
    border-radius: 50%;
    cursor: pointer;
}

.fai-info:hover {
    background: rgb(226, 238, 247);
}



.fas {
    background: rgb(250, 250, 250);
    color: rgb(100, 100, 100);
    border-color: #eee;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
}



#t_Body_title {
    overflow: hidden;
}

.profile-img {
    border-radius: 50%;
    opacity: 0; /* Start with the image hidden */
    animation: fadeIn 0.5s ease-in-out forwards; /* Apply the fade-in animation */
}

@keyframes fadeIn {
    from {
        opacity: 0; /* Start with opacity 0 */
    }
    to {
        opacity: 1; /* End with opacity 1 */
    }
}

/*********************************************************/


#t_Footer {
    padding-bottom: 0px;
    background-color: white;
}

.t-Footer-top {
    display: none;    
}

.t-Footer-version {
    display: none;
}

.enlista-footer {
    color: #888;
    font-size: 10px;
    opacity: 1; /* Initially invisible */
    transition: opacity 0.5s ease-in; /* Fade in over 1 second */
}

@media (min-width: 768px) {
    .enlista-footer {
        font-size: 12px;
    }
}

/* To trigger the fade-in */
.fade-in {
    opacity: 1;
}

/*********************************************************/

@media (pointer:none), (pointer:coarse) {
    .t-Form-fieldContainer1.t-Form-fieldContainer--floatingLabel1 {
        margin-left: 1px;
        margin-right: 1px;
    }
}

.apex-item-group.apex-item-group--popup-lov {
    outline: none !important;
}

.apex-item-multi.is-focused {
    outline: none !important;
}

.is-focused {
    outline: none !important;
}

:focus {
    outline: none !important;
}

textarea:focus, input:focus{
    outline: none !important;
}

.a-IRR-headerLink.has-focus {
    box-shadow: 0 0 0 0px #4696fc inset !important;   
}

*:focus {
    outline: none;
}

* {
    outline-color: darkslateblue !important;
    outline-width: thin !important;
}

/*********************************************************/
/* Modal window title */

.ui-dialog {
    border-radius: 6px;
}

.ui-dialog-titlebar {
    padding: 0px 4px;
    color: white;
    background: #000;
    font-size: 12px !important;
    border-radius: 0px;

}

.ui-dialog .ui-dialog-title {
  font-size: 1.0rem;
  font-weight: 700;
  line-height: 1.2rem;
}

.ui-dialog .ui-dialog-titlebar {
    padding-block-start: unset;
}

.ui-dialog-title {
    font-size: 14px;
}

.ui-dialog-titlebar-close {
    margin: 0px;
    color: white;
    background: none;
    border: none;
    border-radius: 50%;

}

/*********************************************************/