/*
  Custom CSS for Fiori Login Page
  ILCS.YUBBIE 10/11/2025
*/

/* Login Page HTML Style */
/* Button: Change Password */
button#CHANGE_PASSWORD_LINK {
  color: #000000;
  font-weight: lighter;
  background-color: white;
  text-shadow: none
}

button#CHANGE_PASSWORD_LINK:hover {
  background-color: #c0c0c0;
}

/* Copyright Text */
label.sapMLabel {
  color: #ffffff;
  font-weight: bold;
  background: rgb(255 255 255 / 10%);
}

/* Pelindo Logo Bottom Left */
.loginLogo {
  position: fixed;       /* fix position relative to viewport */
  bottom: 20px;          /* distance from bottom */
  left: 20px;            /* distance from left */
  right: auto;           /* reset any previous right alignment */
  top: auto;             /* reset any previous top alignment */
  z-index: 9999;         /* make sure it stays visible above background */
  
  width: 110px;                 /* adjust as needed */
  height: 30px;                 /* keep rectangular shape */
  object-fit: cover;            /* maintain aspect ratio */
  border-radius: 30px;          /* capsule corners */
  border: 4px solid white;      /* white capsule border */
  background-color: white;      /* fills transparent areas */
  box-shadow: 0 0 8px rgba(0,0,0,0.2); /* optional soft shadow */

  display: flex;                /* <-- enable flex layout */
  align-items: center;          /* <-- center vertically */
  justify-content: center;      /* <-- center horizontally */
  gap: 8px;                     /* space between logo and text */
}

/* Divider line */
/* .loginDivider {
  border: none;
  height: 35px;
  background-color: rgb(255 255 255 / 0); /* white semi-transparent line */
/*  margin: 10px 0 15px 0; /* vertical spacing around divider */
/*} */

/* Login Page JS */
/* OTP Button*/
#OTP_LINK {
  font-size: 14px;
  line-height: 1;
  padding: 6px 10px;
  cursor: pointer;
  border: none;
  font-weight: bold;
  background-color: #007cc0;
  color: #ffffff;
  transition: background-color 0.3s, color 0.3s;
}

#OTP_LINK:hover {
  background-color:#41a5dc;
}

/* Log On Button */
#LOGIN_LINK {
  font-weight: bold;
}

#OTP_CHANGE_PASS_LINK {
  font-size: 14px;
  line-height: 1;
  padding: 6px 10px;
  cursor: pointer;
  border: none;
  font-weight: lighter;
  color: #ffffff;
  transition: background-color 0.3s, color 0.3s;
}

/* ===== */
/* Verified Style */
/* OTP Button */
.otpButton-verified {
  background-color: #107e3e;
  color: #ffffff;
}

/* UserName Field */
.userNameField-verified {
  background-color: #c7c7c7;
  cursor: not-allowed;
}

/* Password Field */
.passField-verified {
  background-color: #c7c7c7;
  cursor: not-allowed;
}

/* Status Message */
.statusMsg-error {
  color: #d32f2f;
  font-weight: 600;
}

/* ===== */
/* Change Password Page*/
/* User ID Label */
label#USERNAME_LABEL {
    color: white;
    font-weight: bold;
}

/* Old Password Label */
label#PASSWORD_LABEL {
  color: white;
  font-weight: bold;
}

/* New Password Label */
label#NEW_PASSWORD_LABEL {
  color: white;
  font-weight: bold;
}

/* Confirm Password Label */
label#CONFIRM_PASSWORD_LABEL {
  color: white;
  font-weight: bold;
}

/* Cancel Button */
button#CANCEL_LINK {
  color: #FFFFFF;
  text-shadow: 1px 1px rgb(3 28 252);
  font-weight: bold;
}