/* PIPEFLANGE - Shared Styles */
/* WhatsApp floating button pulse */
#whatsapp-btn { animation: wa-pulse 2s infinite; }
@keyframes wa-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); }
  50%      { box-shadow: 0 0 0 12px rgba(37, 211, 102, 0); }
}
/* Form validation errors */
.field-error { color: #ef4444; font-size: 0.8rem; margin-top: 0.25rem; }
/* Custom scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0f172a; }
::-webkit-scrollbar-thumb { background: #ea580c; border-radius: 4px; }
/* Smooth scroll */
html { scroll-behavior: smooth; }
/* Line clamp */
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* Print */
@media print {
  #whatsapp-btn, #mobile-menu, #top-bar, #header { display: none !important; }
}
/* Active navigation link */
.nav-link.active { color: #ea580c !important; border-bottom: 2px solid #ea580c; }

/* Mobile navigation */
.mobile-nav-link.active { color: #ea580c !important; background: rgba(234, 88, 12, 0.1); }

/* RTL support */
[dir="rtl"] .nav-link { padding-right: 0.5rem; padding-left: 0.5rem; }
[dir="rtl"] .mobile-nav-link { text-align: right; }
[dir="rtl"] .space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-left: 0; margin-right: 0; }
[dir="rtl"] summary i { margin-left: 0; margin-right: 1rem; }

/* Breadcrumb */
.breadcrumb-link { color: #64748b; }
.breadcrumb-link:hover { color: #ea580c; }

/* FAQ detail link hover */
.faq-detail-link { color: #ea580c; font-weight: 600; }
.faq-detail-link:hover { color: #d24b00; }

/* Mobile menu transition */
#mobile-menu { transition: transform 0.3s ease, opacity 0.3s ease; }
#mobile-menu.hidden { transform: translateY(-10px); opacity: 0; pointer-events: none; }
#mobile-menu:not(.hidden) { transform: translateY(0); opacity: 1; }

/* Navigation Dropdowns */
.nav-dropdown { position: relative; }
.nav-dropdown-menu { min-width: 14rem; }
.nav-dropdown-toggle.active { color: #ea580c !important; }
.nav-dropdown-toggle .rotate-180 { transform: rotate(180deg); }

/* Mobile submenu */
.mobile-nav-dropdown-toggle.active { color: #ea580c !important; }
.mobile-nav-dropdown-toggle .rotate-180 { transform: rotate(180deg); }
.mobile-nav-submenu { transition: max-height 0.3s ease; }
.mobile-nav-submenu.hidden { display: none; }

/* Dropdown menu item active */
.nav-dropdown-menu a.text-orange-industrial-500 { color: #ea580c !important; background: rgba(234, 88, 12, 0.08); }
.mobile-nav-submenu a.text-orange-industrial-500 { color: #ea580c !important; }

/* === FORCED DROPDOWN STYLES (fix white background) === */
#header .nav-dropdown-menu {
  background-color: rgba(15, 23, 42, 0.98) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
}
#header {
  background-color: rgba(15, 23, 42, 0.95) !important;
}
#top-bar {
  background-color: #0a0f1c !important;
}
#header .nav-dropdown-menu a {
  color: rgba(255, 255, 255, 0.8) !important;
}
#header .nav-dropdown-menu a:hover {
  color: #ea580c !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* === MOBILE MENU BACKGROUND === */
#mobile-menu {
  background-color: rgba(15, 23, 42, 0.98) !important;
}
#mobile-menu a {
  color: rgba(255, 255, 255, 0.9) !important;
}
#mobile-menu a:hover {
  color: #ea580c !important;
}
#mobile-menu .mobile-nav-submenu {
  background-color: rgba(15, 23, 42, 0.98) !important;
}

/* === STANDALONE DROPDOWN BACKGROUND (belt-and-suspenders) === */
.nav-dropdown-menu {
  background-color: rgba(15, 23, 42, 0.98) !important;
}

/* === RTL DROPDOWN ALIGNMENT === */
[dir="rtl"] .nav-dropdown-menu {
  left: auto !important;
  right: 0 !important;
}

/* === BUTTON BACKGROUND RESET (fixes Products/Resources dropdown white background) === */
button { background-color: transparent; background-image: none; }
#header button, #mobile-menu button { background-color: transparent !important; }
.nav-dropdown-toggle { background-color: transparent !important; }
.mobile-nav-dropdown-toggle { background-color: transparent !important; }
.modal-close { background-color: transparent !important; }
#menu-toggle { background-color: transparent !important; }

/* Ensure all header buttons inherit transparent background */
#header .nav-dropdown-toggle,
#header .nav-link,
#mobile-menu .mobile-nav-dropdown-toggle,
#mobile-menu .mobile-nav-link { background-color: transparent !important; }
