/* Controller styles */
[controller="href"],
[controller="approval-item"] {
  cursor: pointer;
}

@font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'Nunito';
    src: url('/static/fonts/Nunito/static/Nunito-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
  }
  
  /* Additional weights and styles can be added similarly */
  
  body, h1, h2, h3, h4, h5, h6 {
    font-family: 'Nunito', sans-serif;
  }
  
/* WebKit-based browsers (Chrome, Edge, Safari) */
::-webkit-scrollbar {
  width: 12px; /* Adjust width */
  height: 12px; /* Adjust height for horizontal scrollbars */
}

::-webkit-scrollbar-track {
  background: var(--sl-color-neutral-100); /* Shoelace light background */
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: var(--sl-color-primary-600); /* Shoelace primary color */
  border-radius: 50px; /* Fully rounded */
  border: 3px solid var(--sl-color-neutral-100); /* Padding effect */
}

::-webkit-scrollbar-thumb:hover {
  background: var(--sl-color-primary-300); /* Darker on hover */
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--sl-color-primary-200) var(--sl-color-neutral-100);
}


.htmx-swapping {
  opacity: 0;
  transition: opacity 200ms ease-out;
}

.htmx-settling {
  opacity: 1;
}

/* Professional Color Theme Override */
:root {
  /* Professional Primary Colors - Deep Blue/Navy */
  --bs-primary: #1e3a8a;
  --bs-primary-rgb: 30, 58, 138;
  
  /* Professional Secondary Colors - Charcoal */
  --bs-secondary: #374151;
  --bs-secondary-rgb: 55, 65, 81;
  
  /* Success - Professional Green */
  --bs-success: #059669;
  --bs-success-rgb: 5, 150, 105;
  
  /* Warning - Amber */
  --bs-warning: #d97706;
  --bs-warning-rgb: 217, 119, 6;
  
  /* Danger - Professional Red */
  --bs-danger: #dc2626;
  --bs-danger-rgb: 220, 38, 38;
  
  /* Info - Steel Blue */
  --bs-info: #0369a1;
  --bs-info-rgb: 3, 105, 161;
  
  /* Light/Dark neutrals */
  --bs-light: #f8fafc;
  --bs-light-rgb: 248, 250, 252;
  --bs-dark: #1f2937;
  --bs-dark-rgb: 31, 41, 55;
  
  /* Background colors */
  --bs-body-bg: #ffffff;
  --bs-body-color: #374151;
  
  /* Border colors */
  --bs-border-color: #e5e7eb;
  --bs-border-color-translucent: rgba(229, 231, 235, 0.175);
}

/* Override Bootstrap button colors */
.btn-primary {
  --bs-btn-bg: #1e3a8a;
  --bs-btn-border-color: #1e3a8a;
  --bs-btn-hover-bg: #1e40af;
  --bs-btn-hover-border-color: #1e40af;
  --bs-btn-active-bg: #1d4ed8;
  --bs-btn-active-border-color: #1d4ed8;
}

.btn-secondary {
  --bs-btn-bg: #374151;
  --bs-btn-border-color: #374151;
  --bs-btn-hover-bg: #4b5563;
  --bs-btn-hover-border-color: #4b5563;
  --bs-btn-active-bg: #6b7280;
  --bs-btn-active-border-color: #6b7280;
}

.btn-success {
  --bs-btn-bg: #059669;
  --bs-btn-border-color: #059669;
  --bs-btn-hover-bg: #047857;
  --bs-btn-hover-border-color: #047857;
  --bs-btn-active-bg: #065f46;
  --bs-btn-active-border-color: #065f46;
}

.btn-warning {
  --bs-btn-bg: #d97706;
  --bs-btn-border-color: #d97706;
  --bs-btn-hover-bg: #b45309;
  --bs-btn-hover-border-color: #b45309;
  --bs-btn-active-bg: #92400e;
  --bs-btn-active-border-color: #92400e;
}

.btn-danger {
  --bs-btn-bg: #dc2626;
  --bs-btn-border-color: #dc2626;
  --bs-btn-hover-bg: #b91c1c;
  --bs-btn-hover-border-color: #b91c1c;
  --bs-btn-active-bg: #991b1b;
  --bs-btn-active-border-color: #991b1b;
}

.btn-info {
  --bs-btn-bg: #0369a1;
  --bs-btn-border-color: #0369a1;
  --bs-btn-hover-bg: #0284c7;
  --bs-btn-hover-border-color: #0284c7;
  --bs-btn-active-bg: #0ea5e9;
  --bs-btn-active-border-color: #0ea5e9;
}

/* Override badge colors */
.badge.bg-primary { background-color: #1e3a8a !important; }
.badge.bg-secondary { background-color: #374151 !important; }
.badge.bg-success { background-color: #059669 !important; }
.badge.bg-warning { background-color: #d97706 !important; }
.badge.bg-danger { background-color: #dc2626 !important; }
.badge.bg-info { background-color: #0369a1 !important; }

/* Card styling improvements */
.card {
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.card-header {
  background-color: #f8fafc;
  border-bottom: 1px solid #e5e7eb;
  font-weight: 600;
  color: #374151;
}

/* Table improvements */
.table-light > :not(caption) > * > * {
  background-color: #f8fafc;
  color: #374151;
}

.table-hover > tbody > tr:hover > * {
  background-color: #f1f5f9;
}

/* Navigation improvements */
.navbar-dark {
  background-color: #1f2937 !important;
}

.navbar-light {
  background-color: #ffffff;
  border-bottom: 1px solid #e5e7eb;
}

/* Form improvements */
.form-control {
  border-color: #d1d5db;
}

.form-control:focus {
  border-color: #1e3a8a;
  box-shadow: 0 0 0 0.2rem rgba(30, 58, 138, 0.25);
}

/* Alert improvements */
.alert-primary { 
  background-color: #dbeafe; 
  border-color: #bfdbfe; 
  color: #1e40af; 
}

.alert-secondary { 
  background-color: #f3f4f6; 
  border-color: #d1d5db; 
  color: #374151; 
}

.alert-success { 
  background-color: #d1fae5; 
  border-color: #a7f3d0; 
  color: #047857; 
}

.alert-warning { 
  background-color: #fef3c7; 
  border-color: #fde68a; 
  color: #92400e; 
}

.alert-danger { 
  background-color: #fee2e2; 
  border-color: #fecaca; 
  color: #991b1b; 
}

.alert-info { 
  background-color: #dbeafe; 
  border-color: #bfdbfe; 
  color: #0369a1; 
}