/* Login-only branding. This file is globally loaded, so every rule is scoped to
   body.digidel-login-active to avoid altering other website pages. */

/* ── Login brand block ───────────────────────────────── */
body.digidel-login-active .page-card-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.35rem !important;
}

body.digidel-login-active .page-card-head img.app-logo {
  display: none !important;
}

/* Fallback: if JS doesn't run early, still hide Frappe logos on login */
.for-login .page-card-head img.app-logo,
body[data-path="login"] .page-card-head img.app-logo,
body[data-path="login"] .app-logo,
.login-content .app-logo {
  display: none !important;
}

body.digidel-login-active .page-card-head::before {
  display: none !important;
}

body.digidel-login-active .digidel-login-wordmark {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: #111827 !important;
  line-height: 1 !important;
}

body.digidel-login-active .digidel-login-wordmark-dot {
  color: #ef4444 !important;
}

body.digidel-login-active .page-card-head h4 {
  visibility: visible !important;
  position: static !important;
  font-size: 1.35rem !important;
}

body.digidel-login-active .navbar {
  display: none !important;
}

/* Keep login focused: hide signup/create-account panel on login surface */
body[data-path="login"] .for-signup,
body[data-path="login"] .for-email-login,
body[data-path="login"] .for-forgot,
body[data-path="login"] .for-login-with-email-link,
body[data-path="login"] .for-login-otp {
  display: none !important;
}

/* Hide any footer-powered/Frappe attribution block on login page */
body[data-path="login"] .footer-powered,
body[data-path="login"] .page-footer,
body[data-path="login"] .login-footer {
  display: none !important;
}

/* ── Login button: DIGIDEL red gradient ── */
body.digidel-login-active .login-content .btn-primary,
body.digidel-login-active .form-login .btn-primary,
body.digidel-login-active .btn-primary.login-btn {
  background: linear-gradient(135deg, #e63946, #c1121f) !important;
  background-color: #e63946 !important;
  border-color: #c1121f !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(230, 57, 70, 0.35) !important;
}

/* ── Login form inputs: modern, polished fields ── */
body.digidel-login-active .login-content .form-control,
body.digidel-login-active .form-login .form-control,
body.digidel-login-active .login-content input[type="email"],
body.digidel-login-active .login-content input[type="password"],
body.digidel-login-active .login-content input[type="text"],
body.digidel-login-active .form-login input[type="email"],
body.digidel-login-active .form-login input[type="password"],
body.digidel-login-active .form-login input[type="text"] {
  border-radius: 8px !important;
  border: 1px solid #e4e4e9 !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  background-color: #fafafa !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  height: auto !important;
}

body.digidel-login-active .login-content .email-field,
body.digidel-login-active .login-content .password-field,
body.digidel-login-active .form-login .email-field,
body.digidel-login-active .form-login .password-field {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

body.digidel-login-active .login-content .field-icon,
body.digidel-login-active .form-login .field-icon {
  position: absolute !important;
  left: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  pointer-events: none !important;
}

body.digidel-login-active .login-content .email-field .form-control,
body.digidel-login-active .login-content .password-field .form-control,
body.digidel-login-active .form-login .email-field .form-control,
body.digidel-login-active .form-login .password-field .form-control {
  padding-left: 48px !important;
}

body.digidel-login-active .login-content .toggle-password,
body.digidel-login-active .form-login .toggle-password {
  position: absolute !important;
  right: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
}

/* ── Input focus: DIGIDEL red highlight ── */
body.digidel-login-active .login-content .form-control:focus,
body.digidel-login-active .form-login .form-control:focus,
body.digidel-login-active .login-content input[type="email"]:focus,
body.digidel-login-active .login-content input[type="password"]:focus,
body.digidel-login-active .login-content input[type="text"]:focus,
body.digidel-login-active .form-login input[type="email"]:focus,
body.digidel-login-active .form-login input[type="password"]:focus,
body.digidel-login-active .form-login input[type="text"]:focus {
  border-color: #e63946 !important;
  box-shadow: 0 0 0 3px rgba(230, 57, 70, 0.15) !important;
  background-color: #ffffff !important;
  outline: none !important;
}

/* ── Login card: modern rounded card with shadow ── */
body.digidel-login-active .page-card {
  border-radius: 16px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid rgba(0, 0, 0, 0.04) !important;
  margin-top: 3rem !important;
}

/* ── Labels: clean, professional ── */
body.digidel-login-active .login-content label,
body.digidel-login-active .form-login label,
body.digidel-login-active .login-content .form-group label,
body.digidel-login-active .form-login .form-group label {
  font-weight: 500 !important;
  font-size: 13px !important;
  color: #374151 !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.01em !important;
}

/* ── Form group spacing ── */
body.digidel-login-active .login-content .form-group,
body.digidel-login-active .form-login .form-group {
  margin-bottom: 16px !important;
}