/* Global styles for Tequity */

:root {
  /* Primary colors */
  --primary-color: #0056b3;
  --primary-dark: #003d7a;
  --primary-light: #4d8ac8;
  
  /* Secondary colors */
  --secondary-color: #36D7B7;
  --secondary-dark: #2aa58d;
  --secondary-light: #6ce0c9;
  
  /* Neutral colors */
  --dark-blue: #001f3f;
  --light-gray: #f5f5f5;
  --medium-gray: #cccccc;
  --dark-gray: #666666;
  
  /* Text colors */
  --text-dark: #333333;
  --text-light: #ffffff;
}

/* Prevent browser dark mode switching */
html {
  color-scheme: only light;
}

/* Ensure text on dark backgrounds is always light */
.has-background-dark, 
.is-dark, 
.is-primary, 
.button.is-primary, 
.navbar.is-dark, 
.navbar.is-primary {
  color: var(--text-light) !important;
}

/* Ensure navbar text is light */
.navbar.is-dark .navbar-brand > a.navbar-item,
.navbar.is-dark .navbar-brand > a.navbar-item:hover,
.navbar.is-dark .navbar-start > a.navbar-item,
.navbar.is-dark .navbar-start > a.navbar-item:hover,
.navbar.is-dark .navbar-end > a.navbar-item,
.navbar.is-dark .navbar-end > a.navbar-item:hover,
.navbar.is-dark .navbar-item.has-dropdown:hover .navbar-link,
.navbar.is-dark .navbar-link,
.navbar.is-primary .navbar-brand > a.navbar-item,
.navbar.is-primary .navbar-brand > a.navbar-item:hover,
.navbar.is-primary .navbar-start > a.navbar-item,
.navbar.is-primary .navbar-start > a.navbar-item:hover,
.navbar.is-primary .navbar-end > a.navbar-item,
.navbar.is-primary .navbar-end > a.navbar-item:hover,
.navbar.is-primary .navbar-item.has-dropdown:hover .navbar-link,
.navbar.is-primary .navbar-link {
  color: var(--text-light) !important;
}

/* Ensure links have sufficient contrast */
a {
  color: var(--primary-color);
}

a:hover {
  color: var(--primary-dark);
}

/* Ensure buttons have consistent styling */
.button.is-primary {
  background-color: var(--primary-color);
  border-color: transparent;
  color: var(--text-light);
  transition: background-color 0.3s ease, color 0.3s ease;
}

.button.is-primary:hover {
  background-color: var(--primary-dark);
  color: var(--text-light);
}

/* Fix for persistent hover states */
.button.is-primary:not(:hover) {
  background-color: var(--primary-color);
  color: var(--text-light);
}

.button.is-light {
  transition: background-color 0.3s ease, color 0.3s ease;
}

.button.is-light:hover {
  background-color: #e8e8e8;
  color: #363636;
}

.button.is-light:not(:hover) {
  background-color: #f5f5f5;
  color: #363636;
}

/* Ensure form elements have consistent styling */
.input:focus, 
.textarea:focus, 
.select select:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 0.125em rgba(0, 86, 179, 0.25);
}

/* Fix input styling */
.input, .textarea, select {
  background-color: white;
  color: var(--text-dark);
  border: 1px solid #dbdbdb;
}

.input::placeholder, .textarea::placeholder {
  color: #999999;
}

.label {
  color: var(--text-dark);
}

/* Ensure background colors for auth pages */
body.auth-page {
  background-color: var(--light-gray);
}

/* Accessibility improvements */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Focus styles for keyboard navigation */
:focus {
  outline: 2px solid var(--primary-color);
  outline-offset: 2px;
}

/* Skip to content link for accessibility */
.skip-to-content {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--primary-color);
  color: white;
  padding: 8px;
  z-index: 100;
  transition: top 0.3s;
}

.skip-to-content:focus {
  top: 0;
}