﻿/**
 * RateRight Clean Navigation System
 * Bootstrap 5.3.0 Compatible - Works WITH framework, not against it
 * Zero !important declarations - Clean cascade behavior
 */

:root {
  --nav-bg: rgba(30, 41, 59, 0.95);
  --nav-border: #e5e7eb;
  --nav-text: #374151;
  --nav-text-hover: #111827;
  --brand-primary: #1d4ed8;
  --brand-orange: #ea580c;
  --nav-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
  --dropdown-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* Clean navbar foundation - enhance Bootstrap, don't fight it */
.navbar {
  background: var(--nav-bg);
  border-bottom: 1px solid var(--nav-border);
  box-shadow: var(--nav-shadow);
  min-height: 4.5rem;
}

.navbar-brand {
  font-weight: 700;
  font-size: 1.375rem;
  color: var(--nav-text);
  text-decoration: none;
  margin-right: 3rem;
}

.navbar-brand:hover {
  color: var(--brand-primary);
}

.navbar-brand i {
  color: var(--brand-orange);
  margin-right: 0.5rem;
}

/* Desktop navigation - minimal Bootstrap enhancement */
.navbar-nav .nav-link {
  color: var(--nav-text);
  font-weight: 500;
  padding: 0.75rem 1rem;
  border-radius: 0.375rem;
  transition: all 0.15s ease;
}

.navbar-nav .nav-link:hover {
  color: var(--nav-text-hover);
  background-color: #f9fafb;
}

.navbar-nav .nav-link.active {
  color: var(--brand-primary);
  background-color: #eff6ff;
}

/* Clean dropdowns - let Bootstrap handle positioning */
.dropdown-menu {
  background: var(--nav-bg);
  border: 1px solid var(--nav-border);
  border-radius: 0.5rem;
  box-shadow: var(--dropdown-shadow);
  margin-top: 0.5rem;
  min-width: 240px;
}

.dropdown-item {
  padding: 0.75rem 1rem;
  color: var(--nav-text);
  transition: all 0.15s ease;
}

.dropdown-item:hover {
  background-color: #f9fafb;
  color: var(--nav-text-hover);
}

/* Mobile - let Bootstrap handle, add minimal positioning */
@media (max-width: 991.98px) {
  .navbar-collapse {
    background: var(--nav-bg);
    border: 1px solid var(--nav-border);
    border-radius: 0.5rem;
    box-shadow: var(--dropdown-shadow);
    margin-top: 0.5rem;
    padding: 1rem;
  }
  
  .navbar-nav .nav-link {
    padding: 0.875rem 1rem;
    border-radius: 0.375rem;
  }
}

/* GLOBAL NAVBAR BRAND FIX - All Pages */
/* Fix invisible brand text globally */
.navbar .navbar-brand,
nav .navbar-brand,
header .navbar-brand {
  color: #0d6efd !important; /* Force blue on all pages */
  font-weight: 600 !important;
  text-decoration: none !important;
}

.navbar .navbar-brand:hover,
nav .navbar-brand:hover,
header .navbar-brand:hover {
  color: #0a58ca !important; /* Darker blue on hover */
  text-decoration: none !important;
}

/* Ensure hardhat icon is visible */
.navbar-brand img,
.navbar-brand .icon,
.navbar-brand svg,
.navbar-brand i {
  opacity: 1 !important;
  filter: none !important;
}

/* Additional specificity for all potential brand containers */
.navbar-brand {
  color: #0d6efd !important;
  font-weight: 600 !important;
}

.navbar-brand:hover {
  color: #0a58ca !important;
}

