/* Your Global Styles */
:root .lpx-brand-logo {
    --lpx-logo: url('/images/U_Logo.png');
    --lpx-logo-icon: url('/images/U_Logo.png');
}

/* Modern Login Page Styling - Aligned with Angular Frontend */
.lpx-login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.lpx-login-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 16px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 2rem;
  width: 100%;
  max-width: 400px;
  margin: 1rem;
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.lpx-login-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 32px 64px -12px rgba(0, 0, 0, 0.35);
}

.lpx-login-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 2rem;
}

.lpx-login-logo {
  width: 64px;
  height: 64px;
  margin: 0;
  background: linear-gradient(135deg, rgb(var(--brand-primary)), rgb(var(--brand-primary-700, 163 0 48)));
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(var(--brand-primary), 0.3);
  overflow: hidden;
  flex-shrink: 0;
}

.lpx-login-logo img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 4px;
}

.lpx-index-body {
  background-color: #FAFAFA;
}

.lpx-tagline {
  text-transform: capitalize;
}

.lpx-logo-image {
  border-radius: 10px;
}

.lpx-hidden {
  display: none;
}

.lpx-login-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
  letter-spacing: -0.025em;
}

.lpx-login-subtitle {
  color: #6b7280;
  font-size: 0.875rem;
  font-weight: 400;
}


/* Brand CSS variables for host pages */
:root {
  --brand-primary: 201 0 58;   /* #C9003A */
  --brand-secondary: 48 56 66; /* #303842 */
  --brand-success: 22 163 74;  /* #16A34A */
  --brand-info: 14 165 233;    /* #0EA5E9 */
  --brand-warning: 245 158 11; /* #F59E0B */
  --brand-danger: 220 38 38;   /* #DC2626 */
  --brand-black: 0 0 0;        /* #000000 */
}



/* Bootstrap variable overrides to align with marketing palette */
:root, [data-bs-theme="light"] {
  --bs-primary: #C9003A;
  --bs-secondary: #303842;
  --bs-black: #000000;
  --bs-white: #FFFFFF;

  --bs-success: #16A34A;
  --bs-info: #0EA5E9;
  --bs-warning: #F59E0B;
  --bs-danger: #DC2626;

  --bs-body-bg: #FAFAFA;
  --bs-body-color: #303842;
}

/* Dark theme support removed */

/* Toastr brand overrides */
#toast-container > div.toast-success { background-color: #16A34A; }
#toast-container > div.toast-error { background-color: #DC2626; }
#toast-container > div.toast-info { background-color: #0EA5E9; }

/* Host brand helper utilities for Index.cshtml */
.bg-brand-primary { background-color: rgb(var(--brand-primary)); color: #fff; }
.bg-brand-primary-50 { background-color: rgb(var(--brand-primary) / 0.05); }
.bg-brand-primary-100 { background-color: rgb(var(--brand-primary) / 0.10); }
.text-brand-primary { color: rgb(var(--brand-primary)); }

.bg-brand-success-50 { background-color: rgb(var(--brand-success) / 0.05); }
.bg-brand-success-100 { background-color: rgb(var(--brand-success) / 0.10); }
.text-brand-success { color: rgb(var(--brand-success)); }

.bg-brand-secondary-50 { background-color: rgb(var(--brand-secondary) / 0.05); }
.bg-brand-secondary-100 { background-color: rgb(var(--brand-secondary) / 0.10); }
.text-brand-secondary { color: rgb(var(--brand-secondary)); }

.btn-brand-primary {
  background-color: rgb(var(--brand-primary));
  color: #fff;
  transition: background-color 0.2s ease-in-out;
}
.btn-brand-primary:hover { background-color: rgb(var(--brand-primary-700, 163 0 48)); }

/* Success brand helpers and button */
.bg-brand-success { background-color: rgb(var(--brand-success)); color: #fff; }

.btn-brand-success {
  background-color: rgb(var(--brand-success));
  color: #fff;
  transition: background-color 0.2s ease-in-out, filter 0.2s ease-in-out;
}
.btn-brand-success:hover { filter: brightness(0.92); }


/* Modern Form Styling for Login Page */
.lpx-login-form .form-group {
  margin-bottom: 1.5rem;
}

.lpx-login-form .form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}

.lpx-login-form .form-control {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background-color: #ffffff;
  transition: all 0.2s ease-in-out;
  font-family: inherit;
}

.lpx-login-form .form-control:focus {
  outline: none;
  border-color: rgb(var(--brand-primary));
  box-shadow: 0 0 0 3px rgba(var(--brand-primary), 0.1);
}

.lpx-login-form .form-control.is-invalid {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.lpx-login-form .invalid-feedback {
  display: block;
  font-size: 0.875rem;
  color: #dc2626;
  margin-top: 0.25rem;
}

.lpx-login-form .btn-primary {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  background: linear-gradient(135deg, rgb(var(--brand-primary)), rgb(var(--brand-primary-700, 163 0 48)));
  border: none;
  border-radius: 8px;
  color: white;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  letter-spacing: 0.025em;
  box-shadow: 0 4px 12px rgba(var(--brand-primary), 0.3);
}

.lpx-login-form .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(var(--brand-primary), 0.4);
}

.lpx-login-form .btn-primary:active {
  transform: translateY(0);
}

.lpx-login-form .btn-primary:disabled {
  background: #e5e7eb;
  color: #9ca3af;
  box-shadow: none;
  transform: none;
  cursor: not-allowed;
}

.lpx-login-form .form-check {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}

.lpx-login-form .form-check-input {
  margin-right: 0.5rem;
  accent-color: rgb(var(--brand-primary));
}

.lpx-login-form .form-check-label {
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
}

.lpx-login-links {
  text-align: center;
  margin-top: 1.5rem;
}

.lpx-login-links a {
  color: rgb(var(--brand-primary));
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.2s ease-in-out;
}

.lpx-login-links a:hover {
  color: rgb(var(--brand-primary-700, 163 0 48));
  text-decoration: underline;
}

.lpx-login-footer {
  text-align: center;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e5e7eb;
  font-size: 0.875rem;
  color: #6b7280;
}

#toast-container > div.toast-warning { background-color: #F59E0B; }

/* SweetAlert2 brand overrides */
.swal2-confirm { background-color: #C9003A !important; border: none !important; }
.swal2-cancel { background-color: #303842 !important; border: none !important; }

/* Responsive Design for Login Page */
@media (max-width: 640px) {
  .lpx-login-card {
    margin: 0.5rem;
    padding: 1.5rem;
    border-radius: 12px;
  }

  .lpx-login-logo {
    width: 56px;
    height: 56px;
  }

  .lpx-login-title {
    font-size: 1.25rem;
  }

  .lpx-login-form .form-control {
    font-size: 16px; /* Prevents zoom on iOS */
  }
}

@media (max-width: 480px) {
  .lpx-login-card {
    padding: 1rem;
  }
}

/* Dark Mode Support - REMOVED */
/* Dark mode has been disabled for login pages */

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
  .lpx-login-card {
    border: 2px solid currentColor;
    background: white !important;
  }

  .lpx-login-form .btn-primary {
    background: rgb(var(--brand-primary)) !important;
    border: 2px solid rgb(var(--brand-primary));
  }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
  .lpx-login-card,
  .lpx-login-form .form-control,
  .lpx-login-form .btn-primary,
  .lpx-login-links a {
    transition: none;
  }

  .lpx-login-card:hover {
    transform: none;
  }

  .lpx-login-form .btn-primary:hover {
    transform: none;
  }
}

/* Focus Indicators for Accessibility */
.lpx-login-form .form-control:focus,
.lpx-login-form .btn-primary:focus,
.lpx-login-form .form-check-input:focus {
  outline: 2px solid rgb(var(--brand-primary));
  outline-offset: 2px;
}

/* Loading States */
.lpx-login-form .btn-primary.loading {
  position: relative;
  color: transparent;
}

.lpx-login-form .btn-primary.loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid transparent;
  border-top: 2px solid white;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Tenant Selection Styling */
.lpx-tenant-selection {
  margin-bottom: 1.5rem;
  padding: 1rem;
  background: #f9fafb;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
}

.lpx-tenant-selection input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background-color: white;
  font-size: 1rem;
  transition: all 0.2s ease-in-out;
  font-family: inherit;
}

.lpx-tenant-selection input:focus {
  outline: none;
  border-color: rgb(var(--brand-primary));
  box-shadow: 0 0 0 3px rgba(var(--brand-primary), 0.1);
}

.lpx-tenant-selection .btn-secondary {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  font-weight: 600;
  background: rgb(var(--brand-secondary));
  border: none;
  border-radius: 8px;
  color: white;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  letter-spacing: 0.025em;
}

.lpx-tenant-selection .btn-secondary:hover {
  background: rgb(var(--brand-secondary-700, 51 65 85));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--brand-secondary), 0.3);
}

.lpx-tenant-selection .btn-secondary:active {
  transform: translateY(0);
}

/* Dark mode support removed for tenant selection */

/* ABP Tenant Switch Button Override */
#AbpTenantSwitchLink {
  background: rgb(var(--brand-secondary)) !important;
  border: none !important;
  border-radius: 8px !important;
  color: white !important;
  font-weight: 600 !important;
  padding: 0.5rem 1rem !important;
  font-size: 0.875rem !important;
  transition: all 0.2s ease-in-out !important;
  text-transform: none !important;
  letter-spacing: 0.025em !important;
  box-shadow: 0 2px 4px rgba(var(--brand-secondary), 0.2) !important;
}

#AbpTenantSwitchLink:hover {
  background: rgb(var(--brand-secondary-700, 51 65 85)) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px rgba(var(--brand-secondary), 0.3) !important;
  color: white !important;
}

#AbpTenantSwitchLink:active {
  transform: translateY(0) !important;
}

#AbpTenantSwitchLink:focus {
  outline: 2px solid rgb(var(--brand-secondary)) !important;
  outline-offset: 2px !important;
  box-shadow: 0 2px 4px rgba(var(--brand-secondary), 0.2) !important;
}

/* ABP Tenant Modal Styling */
.modal-content {
  border-radius: 16px !important;
  border: none !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.modal-header {
  border-bottom: 1px solid #e5e7eb !important;
  padding: 1.5rem !important;
  border-radius: 16px 16px 0 0 !important;
}

.modal-title {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: #111827 !important;
  letter-spacing: -0.025em !important;
}

.modal-body {
  padding: 1.5rem !important;
}

.modal-body .form-label {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: #374151 !important;
  margin-bottom: 0.5rem !important;
}

.modal-body .form-control {
  padding: 0.75rem 1rem !important;
  font-size: 1rem !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  transition: all 0.2s ease-in-out !important;
  font-family: inherit !important;
}

.modal-body .form-control:focus {
  outline: none !important;
  border-color: rgb(var(--brand-primary)) !important;
  box-shadow: 0 0 0 3px rgba(var(--brand-primary), 0.1) !important;
}

.modal-body .form-text {
  font-size: 0.875rem !important;
  color: #6b7280 !important;
  margin-top: 0.25rem !important;
}

.modal-footer {
  border-top: 1px solid #e5e7eb !important;
  padding: 1.5rem !important;
  border-radius: 0 0 16px 16px !important;
  gap: 0.75rem !important;
}

.modal-footer .btn {
  padding: 0.75rem 1.5rem !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  transition: all 0.2s ease-in-out !important;
  letter-spacing: 0.025em !important;
}

.modal-footer .btn-primary {
  background: linear-gradient(135deg, rgb(var(--brand-primary)), rgb(var(--brand-primary-700, 163 0 48))) !important;
  border: none !important;
  color: white !important;
  box-shadow: 0 4px 12px rgba(var(--brand-primary), 0.3) !important;
}

.modal-footer .btn-primary:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(var(--brand-primary), 0.4) !important;
}

.modal-footer .btn-outline-primary {
  background: transparent !important;
  border: 1px solid #d1d5db !important;
  color: #374151 !important;
}

.modal-footer .btn-outline-primary:hover {
  background: #f9fafb !important;
  border-color: #9ca3af !important;
  color: #111827 !important;
  transform: translateY(-1px) !important;
}

.btn-close {
  background: none !important;
  border: none !important;
  font-size: 1.25rem !important;
  opacity: 0.5 !important;
  transition: opacity 0.2s ease-in-out !important;
}

.btn-close:hover {
  opacity: 0.75 !important;
}

/* Dark mode support removed for modals */

/* Forgot Password Page Specific Styling */
.lpx-login-subtitle {
  color: #6b7280;
  font-size: 0.875rem;
  font-weight: 400;
  margin-bottom: 1rem;
  line-height: 1.5;
}

/* Dark mode support removed for forgot password page */

/* Success/Info Messages */
.alert {
  border-radius: 8px !important;
  border: none !important;
  padding: 1rem 1.25rem !important;
  margin-bottom: 1.5rem !important;
  font-size: 0.875rem !important;
}

.alert-success {
  background-color: #dcfce7 !important;
  color: #166534 !important;
}

.alert-info {
  background-color: #dbeafe !important;
  color: #1e40af !important;
}

.alert-warning {
  background-color: #fef3c7 !important;
  color: #92400e !important;
}

.alert-danger {
  background-color: #fee2e2 !important;
  color: #dc2626 !important;
}

/* Dark mode support removed for alerts */

/* DataTables selection highlight (if used) */
:root {
  --dt-row-selected: 201, 0, 58; /* primary */
  --dt-row-selected-text: 255, 255, 255;
}