:root {
    /* Set everything to Work Sans */
    --font-sans: 'Work Sans', sans-serif !important;
    --font-mono: 'Work Sans', sans-serif !important;
}

/* Force apply to the entire body to ensure no inheritance issues */
body {
    font-family: 'Work Sans', sans-serif !important;
}

/* Ensure table text (file names/dates) uses the cleaner font */
table, .file-list, .breadcrumb {
    font-family: 'Work Sans', sans-serif !important;
}



/* 1. Force White Header Background */
header, .bg-gray-800, .dark\:bg-slate-900 {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important; /* Adds a subtle divider line */
}

/* 2. Force White Search Bar */
input[type="search"], .bg-gray-700 {
    background-color: #f8fafc !important; /* Slightly off-white for contrast */
    color: #1e293b !important; /* Dark text */
    border: 1px solid #cbd5e1 !important;
}

/* 3. Convert White Text to Black/Dark Gray */
.text-white, .dark\:text-white, header a, header span {
    color: #1e293b !important; /* A professional off-black */
}

/* 4. Ensure Search Placeholder is visible */
input::placeholder {
    color: #94a3b8 !important;
}

/* 5. Adjust the Search Icon color */
header svg, .fa-search {
    fill: #1e293b !important;
    color: #1e293b !important;
}

/* 6. Breadcrumb links (Path at the top) */
.breadcrumb-item, .breadcrumb-item a {
    color: #475569 !important;
}


.border-sky-500 {
    border-color: #003366; 
}

/* Force the background of the search input to be white/light */
input#search-input, 
input[name="query"],
.dark .dark\:bg-slate-800,
header input {
    background-color: #ffffff !important;
    background-image: none !important; /* Removes any gradient overlays */
    color: #1e293b !important; /* Dark text so you can see what you type */
    border: 1px solid #cbd5e1 !important; /* Light gray border */
}

/* Fix for the magnifying glass icon container if it stayed blue */
header .relative div, 
header .absolute {
    background-color: transparent !important;
}

/* Ensure the search text is dark even when the "dark" class is on the body */
.dark input#search-input {
    color: #1e293b !important;
    background-color: #ffffff !important;
}