html, body { height:100%; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background: var(--brand-background, #f3f4f6); margin:0; }

.login-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  width: 100vw;
  padding: 1rem;
}
.login-card {
  background: #fff;
  padding: 2.5rem;
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.12);
  text-align: center;
  max-width: 440px;
  width: 100%;
  margin: 2rem auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.login-brand { margin-bottom:0.75rem; }
.login-logo { max-width:164px; height:auto; display:inline-block; }
#login-title { color: var(--brand-primary-color); margin:0.5rem 0 0.25rem; font-weight:600; }
.login-sub { color:#6b7280; margin-bottom:1.5rem; }
.login-error { background:#fee2e2; color:#b91c1c; border:1px solid #fca5a5; padding:0.75rem; border-radius:10px; margin-bottom:1rem; text-align:left; }

.social-section { margin-bottom:1rem; }
.social-divider { display:flex; align-items:center; gap:0.75rem; color:#6b7280; font-size:0.9rem; justify-content:center; }
.social-divider:before, .social-divider:after { content:""; flex:1; height:1px; background:#e5e7eb; }
.social-buttons { display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center; margin:0.75rem 0; }
.btn-social { display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; border:1px solid #e5e7eb; border-radius:10px; padding:0.7rem 1rem; color:#374151; background:#fff; text-decoration:none; transition: border-color .15s ease, box-shadow .15s ease; width:100%; max-width:200px; box-sizing:border-box; }
.btn-social:hover { border-color: var(--brand-primary-color); box-shadow: 0 0 0 3px rgba(149,193,31,0.15); }
.social-or { display:flex; align-items:center; justify-content:center; color:#6b7280; font-size:0.85rem; margin:0.5rem 0; }

/* Unified form styling for clean private cloud platform look */
.field {
  text-align: left;
  margin-bottom: 1.25rem;
  display: flex;
  flex-direction: column;
}
.field label {
  display: block;
  font-size: 0.9rem;
  color: #374151;
  margin-bottom: 0.4rem;
  font-weight: 500;
}
.field input[type="text"],
.field input[type="password"],
.field input[type="email"],
.field input[type="number"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.85rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  font-size: 0.95rem;
  background: #fff;
  color: #111827;
  transition: all 0.2s ease;
}
.field input:focus {
  outline: none;
  border-color: var(--brand-primary-color);
  box-shadow: 0 0 0 3px rgba(149,193,31,0.2);
}
.field input::placeholder {
  color: #9ca3af;
}
.field-error { margin-top: 0.35rem; color: #b91c1c; font-size: 0.85rem; }
.checkbox { margin: 0.75rem 0; }
.checkbox input { margin-right: 0.5rem; transform: translateY(1px); }

/* Unified button styling - matching input border radius */
.btn-primary {
  background: var(--brand-primary-color) !important;
  color: #fff !important;
  padding: 0.9rem 1.2rem;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  width: 100%;
  margin-top: 0.5rem;
  font-weight: 600;
  font-size: 0.95rem;
  display: block;
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.btn-primary:hover { 
  filter: brightness(0.96); 
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(149,193,31,0.25);
}
.btn-primary:focus { 
  outline:none; 
  box-shadow: 0 0 0 3px rgba(149,193,31,0.3); 
}
.btn-primary:active {
  transform: translateY(0);
}

.login-links { 
  display:flex; 
  justify-content:space-between; 
  margin-top:1rem;
  padding-top:1rem;
  border-top: 1px solid #f3f4f6;
}
.login-links a { 
  color: var(--brand-primary-color); 
  text-decoration:none; 
  font-size: 0.9rem;
  font-weight: 500;
}
.login-links a:hover { text-decoration:underline; }
.login-footer { 
  margin-top:1.5rem; 
  color:#9ca3af; 
  font-size:0.85rem;
  padding-top:1rem;
  border-top: 1px solid #f3f4f6;
}
.login-card--wide {
  max-width: 520px;
}
.content-copy {
  color: #4b5563;
  text-align: left;
  line-height: 1.6;
  margin: 0 0 1rem;
}
.status-note {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 0.95rem 1rem;
  margin-bottom: 1rem;
  text-align: left;
  color: #374151;
  line-height: 1.6;
}
.status-note p {
  margin: 0;
}
.status-note p + p {
  margin-top: 0.75rem;
}
.action-group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
.btn-secondary {
  background: #fff;
  color: #23272f;
  padding: 0.9rem 1.2rem;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  cursor: pointer;
  width: 100%;
  font-weight: 600;
  font-size: 0.95rem;
  display: block;
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.btn-secondary:hover {
  border-color: var(--brand-primary-color);
  box-shadow: 0 0 0 3px rgba(149,193,31,0.15);
  transform: translateY(-1px);
}
.btn-secondary:focus {
  outline:none;
  box-shadow: 0 0 0 3px rgba(149,193,31,0.2);
  border-color: var(--brand-primary-color);
}
.inline-link {
  color: var(--brand-primary-color);
  text-decoration: none;
  font-weight: 600;
}
.inline-link:hover {
  text-decoration: underline;
}
.login-card--form {
  max-width: 640px;
}
.profile-form {
  text-align: left;
}
.profile-form > div {
  margin-bottom: 1rem;
}
.profile-form label,
.profile-form .pf-v5-c-form__label,
.profile-form .pf-v5-c-form__group-label {
  display: block;
  font-size: 0.92rem;
  color: #374151;
  margin-bottom: 0.35rem;
  font-weight: 600;
}
.profile-form input,
.profile-form select,
.profile-form textarea,
.profile-form .pf-v5-c-form-control {
  width: 100%;
  padding: 0.8rem 0.95rem;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  font-size: 1rem;
  background: #fff;
  box-sizing: border-box;
  color: #111827;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.profile-form input:focus,
.profile-form select:focus,
.profile-form textarea:focus,
.profile-form .pf-v5-c-form-control:focus {
  outline: none;
  border-color: var(--brand-primary-color);
  box-shadow: 0 0 0 3px rgba(149,193,31,0.2);
}
.profile-form textarea {
  min-height: 120px;
  resize: vertical;
}
.profile-form [aria-invalid="true"] {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220,38,38,0.12);
}
.profile-form .required {
  color: #b91c1c;
  margin-left: 0.25rem;
}
.profile-form .pf-v5-c-form__helper-text,
.profile-form .pf-v5-c-helper-text,
.profile-form .field-error,
.profile-form span[id^="input-error-"] {
  display: block;
  margin-top: 0.35rem;
  color: #b91c1c;
  font-size: 0.85rem;
  line-height: 1.5;
}
.profile-form .pf-v5-c-check {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  margin: 0.75rem 0;
}
.profile-form .pf-v5-c-check__input {
  width: auto;
  margin-top: 0.25rem;
}
.profile-form .pf-v5-c-check__label {
  margin-bottom: 0;
  font-weight: 500;
}
