/* e:\Alan AI\agency-projects\auto-monster\style.css */

/* Global Variables & Theming */
:root {
    --color-neon: #E2F904;
    --color-dark: #000000;
    --color-charcoal: #080808;
    --color-gray: #121212;
    --color-border: rgba(255, 255, 255, 0.08);
    --font-family: 'Google Sans', 'Google Sans Hebrew', 'Noto Sans Hebrew', sans-serif;
}

/* Base Styles */
body {
    font-family: var(--font-family);
    background-color: var(--color-dark);
    color: #ffffff;
    overflow-x: hidden;
    direction: rtl; /* Standard Hebrew RTL layout */
}

/* Logical RTL Support & Direction Protect */
.ltr-dir {
    direction: ltr;
    display: inline-block;
}

/* Carbon Fiber Tech Pattern Background overlay */
.carbon-pattern {
    position: relative;
}

.carbon-pattern::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('pattern.webp');
    background-repeat: repeat;
    background-size: 180px;
    opacity: 0.05;
    pointer-events: none;
    z-index: 1;
}

/* Subtle Neon Glow Effects */
.neon-glow-btn {
    box-shadow: 0 0 15px rgba(226, 249, 4, 0.25);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.neon-glow-btn:hover {
    box-shadow: 0 0 30px rgba(226, 249, 4, 0.6);
    transform: translateY(-2px);
}

.neon-border-glow {
    transition: all 300ms ease;
}

.neon-border-glow:hover {
    border-color: var(--color-neon);
    box-shadow: 0 0 20px rgba(226, 249, 4, 0.15);
}

/* Glassmorphism Classes */
.glass-panel {
    background: rgba(18, 18, 18, 0.7);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.glass-navbar {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('pattern.webp');
    background-size: 51%;
    background-repeat: repeat;
    background-color: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Custom Neon Icon Filter to recolor black/grey SVGs to vibrant neon yellow (#E2F904) */
.neon-icon-filter {
    filter: invert(93%) sepia(85%) saturate(3015%) hue-rotate(6deg) brightness(105%) contrast(101%);
}

/* Continuous linear scroll for Brands Swiper */
.brands-swiper .swiper-wrapper {
    transition-timing-function: linear !important;
}

/* Invert black brand logos to white for dark theme contrast */
.invert-logo {
    filter: invert(100%) !important;
}

/* Infinite Scrolling Marquee for Brands */
@keyframes marquee {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(50%); /* For RTL, scrolling right */
    }
}

@keyframes marquee-ltr {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-50%);
    }
}

.marquee-container {
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    width: 100%;
}

.marquee-content {
    display: inline-flex;
    animation: marquee-ltr 25s linear infinite;
    width: max-content;
}

.marquee-container:hover .marquee-content {
    animation-play-state: paused;
}

/* Pulsing Green WhatsApp Ripple Ring */
@keyframes whatsappRipple {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4), 0 0 0 10px rgba(37, 211, 102, 0.2);
    }
    100% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0), 0 0 0 30px rgba(37, 211, 102, 0);
    }
}

.whatsapp-pulse {
    animation: whatsappRipple 2s infinite;
}

/* Mobile Action Bar Styles */
.mobile-action-bar {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 32px);
    max-width: 340px;
    height: 64px;
    border-radius: 32px;
    display: none;
    z-index: 9999;
    background: rgba(10, 10, 10, 0.8);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) {
    .mobile-action-bar {
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 0 16px;
    }
    
    body {
        padding-bottom: 100px; /* Safe padding for mobile bottom bar */
    }
}

/* Custom testimonial transition styling */
.testimonial-fade {
    transition: opacity 300ms ease, transform 300ms ease;
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--color-dark);
}

::-webkit-scrollbar-thumb {
    background: #222222;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-neon);
}

/* Failsafe SVG Fills: Guarantees solid-filled icons do not render as messy overlapping outlines */
.header-whatsapp-icon,
.header-whatsapp-icon path,
.desktop-whatsapp-float svg,
.desktop-whatsapp-float svg path,
.mobile-action-bar svg[fill="currentColor"],
.mobile-action-bar svg[fill="currentColor"] path,
.social-links svg,
.social-links svg path {
    fill: currentColor !important;
    stroke: none !important;
}