/* WCAG 2.2 AA: ensure outline-primary is accessible in light theme */
.btn-outline-primary {
  color: #084298;            /* Dark text meets 4.5:1 on white */
  border-color: #084298;
}
.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary.active {
  background-color: #084298; /* Dark accessible primary */
  border-color: #084298;
  color: #ffffff;
}
.btn-outline-primary:focus-visible {
  outline: 2px solid #003366;
  outline-offset: 2px;
  box-shadow: none;
}
/* === MOVED TO variables.css === */

/* === MOVED TO accessibility.css === */

/* === MOVED TO utilities.css === */

/* === MOVED TO panels.css === */

/* === MOVED TO modals.css === */

/* === MOVED TO visuals.css === */

/* === MOVED TO timeline.css === */

/* === MOVED TO buttons.css === */

/* === MOVED TO dashboard.css === */

/* === MOVED TO footer.css === */

/* === MOVED TO dark-theme.css === */

/* === MOVED TO responsive.css === */

/* === Image Upload Preview Styles (WCAG 2.2 Compliant) === */
.visual-image-preview, .project-image-preview {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  min-width: 60px;
  max-width: 220px;
  max-height: 220px;
  border: 1.5px dashed #888;
  border-radius: 8px;
  background: #fafbfc;
  margin: 0 auto;
  padding: 8px;
  overflow: hidden;
}
.visual-image-preview img, .project-image-preview img {
  max-width: 100%;
  max-height: 180px;
  display: block;
  margin: 0 auto;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.07);
}
.visual-image-preview .filename, .project-image-preview .filename {
  text-align: center;
  font-size: 13px;
  color: #333;
  margin-top: 8px;
  word-break: break-word;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.visual-image-upload-wrapper, .project-image-upload-wrapper {
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
}
/* Accessibility: Ensure focus ring is visible */
.visual-image-upload-wrapper input[type="file"], .project-image-upload-wrapper input[type="file"] {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}
/* End Image Upload Preview Styles */

/* --- Documentation ---
Added .visual-image-preview and .project-image-preview for AJAX image upload preview (WCAG 2.2 compliant, high contrast, responsive, accessible)
*/

/* === Site Tagline Styles (WCAG 2.2 Compliant) === */
.tagline-container {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  border-bottom: 1px solid #dee2e6;
  padding: 8px 0;
  text-align: left;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.site-tagline {
  margin: 0;
  font-style: italic;
  font-size: 12px;
  color: #6c757d;
  font-weight: 400;
  line-height: 1.4;
  max-width: 800px;
  margin: 0;
  padding: 0 15px;
  text-align: left;
}

/* Dark theme support */
[data-bs-theme="dark"] .tagline-container {
  background: linear-gradient(135deg, #2c3034 0%, #212529 100%);
  border-bottom-color: #495057;
}

[data-bs-theme="dark"] .site-tagline {
  color: #adb5bd;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .site-tagline {
    font-size: 0.9em;
    padding: 0 10px;
  }
}

/* Accessibility: Ensure sufficient color contrast */
.site-tagline {
  color: #495057; /* Darker gray for better contrast */
}

[data-bs-theme="dark"] .site-tagline {
  color: #ced4da; /* Lighter gray for dark theme contrast */
}
/* End Site Tagline Styles */

/* === Navbar Logo Styles (WCAG 2.2 Compliant) === */
.navbar-logo {
  height: 32px;
  width: auto;
  max-width: 48px;
  object-fit: contain;
  filter: brightness(1);
  transition: filter 0.2s ease-in-out;
}

/* Dark theme logo adjustment */
[data-bs-theme="dark"] .navbar-logo {
  filter: brightness(1.1);
}

/* Hover effect for better UX */
.navbar-brand:hover .navbar-logo {
  filter: brightness(1.2);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .navbar-logo {
    height: 28px;
    max-width: 40px;
  }
}

@media (max-width: 576px) {
  .navbar-logo {
    height: 24px;
    max-width: 36px;
  }
}
/* End Navbar Logo Styles */

/* === Scroll Prevention Styles (WCAG 2.2 Compliant) === */
.no-scroll {
  overflow: hidden !important;
  position: fixed;
  width: 100%;
  height: 100%;
}

/* Ensure restoration spinner doesn't cause scrolling */
#restorationSpinner {
  overflow: hidden !important;
}

#restorationSpinner > div {
  overflow: auto;
  max-width: 90vw;
  max-height: 90vh;
}
/* End Scroll Prevention Styles */