/* Minimal, scoped light theme contrast tweaks while staying Minia-consistent */

/* Apply only when light mode is active */
:root.theme-light,
body[data-bs-theme="light"] {
  /* Slightly darker separators for better definition */
  --bs-border-color: #ced4da; /* darker than default for more contrast */
  --bs-card-border-color: var(--bs-border-color);
  --bs-table-border-color: var(--bs-border-color);

  /* Subtle layer contrast between body and secondary backgrounds */
  --bs-secondary-bg: #f8f9fa; /* was #fff */
  --bs-tertiary-bg: #f6f7fb;  /* keep close to Minia */

  /* Keep body background white for Minia look, but ensure cards stand out */
  --bs-card-bg: #ffffff;
  --bs-card-cap-bg: #f8f9fa;

  /* Topbar and sidebar in Minia are off-white; nudge a touch for contrast */
  --bs-topnav-bg: #f6f7fb; /* previously #fbfaff in Minia, very subtle */
  --bs-sidebar-bg: #f8f9fb; /* slightly more contrast than #fbfaff */
}

/* Topbar uses the token via [data-topbar=light] in Minia; ensure background picks up variable */
body[data-topbar="light"] #page-topbar {
  background-color: var(--bs-topnav-bg) !important;
  border-bottom: 1px solid var(--bs-border-color);
}

/* Sidebar background + divider clarity */
body[data-sidebar="light"] .vertical-menu {
  background: var(--bs-sidebar-bg) !important;
  border-right: 1px solid var(--bs-border-color);
}

/* Card separation in light mode */
body[data-bs-theme="light"] .card,
.theme-light .card {
  border: 1px solid var(--bs-card-border-color) !important;
}

/* Table borders a bit more visible */
body[data-bs-theme="light"] .table,
.theme-light .table {
  --bs-table-border-color: var(--bs-border-color);
}

/* Page content subtle background band to avoid “all-white” feel */
body[data-bs-theme="light"] .page-content {
  background-color: var(--bs-tertiary-bg);
}

/* Keep footer separated */
body[data-bs-theme="light"] .footer {
  border-top: 1px solid var(--bs-border-color);
  background-color: #fff;
}

/* Use Minia defaults for top spacing; no extra offsets here */

/* Auth: align typography with Minia auth pages */
.auth-page .auth-content h5,
.auth-page .auth-content h6 {
  font-size: 1rem; /* ~16px */
}
.auth-page .auth-content p.text-muted {
  font-size: 0.9rem;
}
.auth-page .signin-other-title h5,
.auth-page .signin-other-title h6 {
  font-size: 0.875rem; /* 14px */
}

/* Header: ensure brand box equals topbar height (no visual mismatch) */
#page-topbar .navbar-header {
  height: 70px;            /* enforce exact header height */
  min-height: 70px;
}
#page-topbar .navbar-brand-box {
  height: 70px;            /* match header height */
  padding-top: 0;          /* remove vertical padding side-effects */
  padding-bottom: 0;
  display: flex;           /* center logo vertically */
  align-items: center;
  box-shadow: none;        /* avoid shadow making it look taller */
}
#page-topbar .logo {
  line-height: 70px;       /* align text + inline elements to header */
}

/* Google Sign-In Button Styling and Theme Integration */

/* Container for Google Sign-In button with proper spacing and centering */
.google-signin-container {
  margin: 1rem 0;
  min-height: 50px; /* Ensure consistent spacing even if button loads slowly */
}

/* Enhanced styling for Google Sign-In button */
.google-signin-button {
  margin: 0 auto !important;
  display: block !important;
  width: fit-content !important;
}

/* Theme-specific adjustments for auth pages */
.auth-page .google-signin-container {
  background: transparent;
  border-radius: 8px;
  padding: 0.75rem;
  transition: background-color 0.3s ease;
}

/* Light theme specific styling */
body[data-bs-theme="light"] .auth-page .google-signin-container,
.theme-light .auth-page .google-signin-container {
  background-color: rgba(248, 249, 250, 0.5);
  border: 1px solid rgba(206, 212, 218, 0.3);
}

/* Dark theme specific styling */
body[data-bs-theme="dark"] .auth-page .google-signin-container,
.theme-dark .auth-page .google-signin-container {
  background-color: rgba(33, 37, 41, 0.3);
  border: 1px solid rgba(73, 80, 87, 0.3);
}

/* Enhanced signin-other-title styling for better visual hierarchy */
.auth-page .signin-other-title {
  position: relative;
  margin: 1.5rem 0 1rem 0;
}

.auth-page .signin-other-title h6 {
  font-size: 0.875rem; /* 14px */
  font-weight: 500;
  position: relative;
  background: var(--bs-body-bg);
  padding: 0 1rem;
  display: inline-block;
}

.auth-page .signin-other-title::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--bs-border-color);
  z-index: 1;
}

.auth-page .signin-other-title h6 {
  position: relative;
  z-index: 2;
}

/* Responsive adjustments for Google button */
@media (max-width: 576px) {
  .google-signin-button {
    max-width: 100% !important;
  }
  
  .google-signin-container {
    padding: 0.5rem;
  }
}

/* Ensure proper spacing between form and social login */
.auth-page form + .google-signin-container,
.auth-page form + div.text-center {
  margin-top: 2rem;
}

/* Enhanced social-list-item theming for fallback providers */
body[data-bs-theme="dark"] .social-list-item {
  border-color: var(--bs-gray-600) !important;
  color: var(--bs-gray-400) !important;
  background-color: var(--bs-gray-800) !important;
}

body[data-bs-theme="dark"] .social-list-item:hover {
  border-color: var(--bs-primary) !important;
  color: var(--bs-primary) !important;
  background-color: var(--bs-gray-700) !important;
}

/* Loading state for Google button container */
.google-signin-container:empty::after {
  content: "Google Anmeldung wird geladen...";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  font-size: 0.875rem;
  color: var(--bs-text-muted);
  font-style: italic;
}