:root {
  --main-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.wrappersize-idp {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important; /* kill old margins */
  border: #f5f5f5;
  background-color: white;
  box-shadow: none !important;
  max-width: 45rem !important;
  width: 100%;
  font-family: var(--main-font-family) !important;
  font-weight: 400 !important;
  padding: 30px;
}

#login-header {
    display: none !important;
}

.signin-title {
  font-size: 21px;
  font-weight: bold;
}

.wrappersize-idp .col-md-12 p {
  text-align: left !important;
  font-family: var(--main-font-family), "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

/* Default gray border */
#emailDiv input {
  border: 1px solid #ccc;
  border-radius: 5px !important;
  padding: 10px !important;
  width: 100% !important;
  transition: border-color 0.3s !important;
  color: #000000a8;
  margin-top: 5px;
}

/* On focus, change border to Shopify blue (#0045a3) */
#emailDiv input:focus {
  border: 2px solid #005bd3;
  border-radius: 5px !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Base button styles */
.custom-button {
  color: white !important;  /* text color */
  border: 1px solid #0045a3 ;       /* border */
  background-color: #005bd3 ;
  font-size: 16px !important;
}

/* Focus state */
.custom-button:hover {
  background-color: #0045a3 ;
  border-color: #0045a3 ;
  outline: none !important; /* remove default focus outline */
  box-shadow: none !important; /* remove shadow */
}

/* Disabled state */
.custom-button:disabled {
  background-color: #a0a0a0 !important;  /* gray out when disabled */
  border-color: #888 !important;
  cursor: not-allowed !important;
  opacity: 0.7;
}

.form-message {
  font-size: 14px;
  font-weight: 500;
  padding-left: 0 !important;
  text-align: left !important;
  margin-left: -18px !important;
}

.actionmessage {
  padding-left: 0 !important;
  text-align: left !important;
  margin-left: -15px !important;
  font-weight: 400 !important;
}

.error-message {
  color: #d93025;  /* red */
}

.success-message {
  color: #188038;  /* green */
}

.azure-logo {
  height: 32px !important;
  width: 32px !important;
  display: inline-block !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;    /* stops flex shrinking */
}

.input-custom,
.custom-button {
  height: 45px !important;              /* same height for both */
  font-size: 16px !important;           /* consistent text size */
  border-radius: 7px !important;        /* match border radius */
}

.otp-input {
    border-radius: 7px !important;
    border: 1px solid #ccc;
}

.otp-input:focus {
    border: 2px solid #005bd3;
}

input[type="submit"],
button[type="submit"] {
    margin-top: 10px; /* Adjust value as needed */
}