/* Header Style Variations - White Tones */

/* Style 1: Clean White - Minimal and elegant */
.header-style-1 {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.header-style-1 .logo-icon {
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0) !important;
}

.header-style-1 .logo-icon i {
    color: #64748b !important;
}

.header-style-1 .logo-text {
    color: #1e293b !important;
}

.header-style-1 .logo-tagline {
    color: #64748b !important;
}

.header-style-1 .nav-link {
    color: #475569 !important;
}

.header-style-1 .nav-link:hover {
    color: #1e293b !important;
    background: #f1f5f9 !important;
}

.header-style-1 .nav-link.active {
    color: #1e293b !important;
    background: #e2e8f0 !important;
}

.header-style-1 .action-button {
    background: linear-gradient(135deg, #f8fafc, #f1f5f9) !important;
    color: #334155 !important;
    border: 1px solid #e2e8f0 !important;
}

.header-style-1 .action-button:hover {
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0) !important;
    color: #1e293b !important;
}

.header-style-1 .mobile-menu-btn {
    color: #475569 !important;
}

.header-style-1 .mobile-menu-btn:hover {
    background: #f1f5f9 !important;
    color: #1e293b !important;
}

.header-style-1 .search-box {
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
}

.header-style-1 .search-input,
.header-style-1 .search-select {
    background: #ffffff !important;
    color: #334155 !important;
    border: 1px solid #e2e8f0 !important;
}

.header-style-1 .search-input::placeholder {
    color: #94a3b8 !important;
}

.header-style-1 .search-button {
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0) !important;
    color: #1e293b !important;
}

.header-style-1 .mobile-menu {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px) !important;
    border-top: 1px solid #e2e8f0 !important;
}

/* Style 2: Soft Pearl - Warm and sophisticated */
.header-style-2 {
    background: linear-gradient(135deg, #fefefe 0%, #faf9f7 50%, #f5f3f0 100%) !important;
    border-bottom: 1px solid #ebe8e3 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

.header-style-2 .logo-icon {
    background: linear-gradient(135deg, #f5f3f0, #ebe8e3) !important;
}

.header-style-2 .logo-icon i {
    color: #8b7f6f !important;
}

.header-style-2 .logo-text {
    color: #3d3528 !important;
}

.header-style-2 .logo-tagline {
    color: #8b7f6f !important;
}

.header-style-2 .nav-link {
    color: #5c5447 !important;
}

.header-style-2 .nav-link:hover {
    color: #3d3528 !important;
    background: #f5f3f0 !important;
}

.header-style-2 .nav-link.active {
    color: #3d3528 !important;
    background: #ebe8e3 !important;
}

.header-style-2 .action-button {
    background: linear-gradient(135deg, #faf9f7, #f5f3f0) !important;
    color: #5c5447 !important;
    border: 1px solid #ebe8e3 !important;
}

.header-style-2 .action-button:hover {
    background: linear-gradient(135deg, #f5f3f0, #ebe8e3) !important;
    color: #3d3528 !important;
}

.header-style-2 .mobile-menu-btn {
    color: #5c5447 !important;
}

.header-style-2 .mobile-menu-btn:hover {
    background: #f5f3f0 !important;
    color: #3d3528 !important;
}

.header-style-2 .search-box {
    background: #faf9f7 !important;
    border-top: 1px solid #ebe8e3 !important;
}

.header-style-2 .search-input,
.header-style-2 .search-select {
    background: #ffffff !important;
    color: #5c5447 !important;
    border: 1px solid #ebe8e3 !important;
}

.header-style-2 .search-input::placeholder {
    color: #a39a8c !important;
}

.header-style-2 .search-button {
    background: linear-gradient(135deg, #f5f3f0, #ebe8e3) !important;
    color: #3d3528 !important;
}

.header-style-2 .mobile-menu {
    background: rgba(250, 249, 247, 0.98) !important;
    backdrop-filter: blur(10px) !important;
    border-top: 1px solid #ebe8e3 !important;
}

/* Style 3: Ice White - Cool and modern */
.header-style-3 {
    background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 50%, #e0f2fe 100%) !important;
    border-bottom: 1px solid #bae6fd !important;
    box-shadow: 0 2px 10px rgba(56, 189, 248, 0.08) !important;
}

.header-style-3 .logo-icon {
    background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important;
}

.header-style-3 .logo-icon i {
    color: #0284c7 !important;
}

.header-style-3 .logo-text {
    color: #0c4a6e !important;
}

.header-style-3 .logo-tagline {
    color: #0284c7 !important;
}

.header-style-3 .nav-link {
    color: #075985 !important;
}

.header-style-3 .nav-link:hover {
    color: #0c4a6e !important;
    background: #e0f2fe !important;
}

.header-style-3 .nav-link.active {
    color: #0c4a6e !important;
    background: #bae6fd !important;
}

.header-style-3 .action-button {
    background: linear-gradient(135deg, #f0f9ff, #e0f2fe) !important;
    color: #075985 !important;
    border: 1px solid #bae6fd !important;
}

.header-style-3 .action-button:hover {
    background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important;
    color: #0c4a6e !important;
}

.header-style-3 .mobile-menu-btn {
    color: #075985 !important;
}

.header-style-3 .mobile-menu-btn:hover {
    background: #e0f2fe !important;
    color: #0c4a6e !important;
}

.header-style-3 .search-box {
    background: #f0f9ff !important;
    border-top: 1px solid #bae6fd !important;
}

.header-style-3 .search-input,
.header-style-3 .search-select {
    background: #ffffff !important;
    color: #075985 !important;
    border: 1px solid #bae6fd !important;
}

.header-style-3 .search-input::placeholder {
    color: #7dd3fc !important;
}

.header-style-3 .search-button {
    background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important;
    color: #0c4a6e !important;
}

.header-style-3 .mobile-menu {
    background: rgba(240, 249, 255, 0.98) !important;
    backdrop-filter: blur(10px) !important;
    border-top: 1px solid #bae6fd !important;
}

/* Smooth transitions for all styles */
.header-style-1,
.header-style-2,
.header-style-3 {
    transition: all 0.3s ease !important;
}

.header-style-1 *,
.header-style-2 *,
.header-style-3 * {
    transition: all 0.2s ease !important;
}