/* FFP Premium Search v5.2.0 - Modernized UI */

/* Modal */
.ffp-search-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99999;display:none}
.ffp-search-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

/* Container - subtle shadow */
.ffp-search-container{position:relative;width:90%;max-width:1400px;max-height:85vh;margin:5vh auto;background:#fff;border-radius:20px;box-shadow:0 25px 60px -15px rgba(0,0,0,0.3);display:flex;flex-direction:column;overflow:hidden}

/* Header */
.ffp-search-header{display:flex;align-items:center;gap:12px;padding:24px;border-bottom:1px solid #f0f0f0;background:linear-gradient(180deg,#fff 0%,#fafafa 100%)}
.ffp-search-header .ffp-search-input-wrap{flex:1;min-width:0}

/* SEARCH INPUT - Subtle red glow by default */
.ffp-search-input-wrap{
    display:flex;
    align-items:center;
    gap:14px;
    background:#fff;
    border:2px solid #e8e8e8;
    border-radius:14px;
    padding:14px 18px;
    transition:all 0.3s ease;
    box-shadow:0 0 0 3px rgba(200,30,50,0.08), 0 2px 8px rgba(0,0,0,0.04);
}

.ffp-search-input-wrap:hover{
    border-color:#ddd;
    box-shadow:0 0 0 4px rgba(200,30,50,0.12), 0 4px 12px rgba(0,0,0,0.06);
}

.ffp-search-input-wrap:focus-within{
    border-color:#C81E32;
    box-shadow:0 0 0 4px rgba(200,30,50,0.15), 0 4px 16px rgba(200,30,50,0.1);
}

/* Search icon */
.ffp-search-icon{width:22px!important;height:22px!important;min-width:22px!important;max-width:22px!important;flex-shrink:0;color:#999;transition:color 0.2s}
.ffp-search-input-wrap:focus-within .ffp-search-icon{color:#C81E32}

#ffp-search-input{flex:1;border:none;outline:none;font-size:17px;background:transparent;color:#1a1a1a;font-weight:400}
#ffp-search-input::placeholder{color:#767676;font-weight:400}

/* Close button — inline with search input, square w/ subtle gray */
.ffp-search-close{display:inline-flex;align-items:center;justify-content:center;background:#f3f4f6;border:1px solid #e5e7eb;padding:0;width:44px;height:44px;cursor:pointer;color:#374151;border-radius:10px;transition:all 0.15s;flex-shrink:0}
.ffp-search-close:hover{background:#fee2e2;border-color:#fecaca;color:#c81e32}
.ffp-search-close svg{width:18px;height:18px}

/* Body */
.ffp-search-body{display:flex;flex:1;overflow:hidden;min-height:400px}

/* Sidebar */
.ffp-search-sidebar{width:220px;padding:20px;border-right:1px solid #f0f0f0;overflow-y:auto;background:#fafafa}
.ffp-search-section{margin-bottom:24px}
.ffp-search-section h4{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:#666;margin:0 0 12px}

/* Trending tags */
#ffp-popular-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.ffp-trending-tag{
    display:inline-flex;
    align-items:center;
    background:#fff;
    border:1px solid #e5e5e5;
    padding:8px 14px;
    border-radius:25px;
    font-size:13px;
    font-weight:500;
    color:#444;
    cursor:pointer;
    white-space:nowrap;
    font-family:inherit;
    transition:all 0.2s ease;
    box-shadow:0 1px 3px rgba(0,0,0,0.04);
}
.ffp-trending-tag:hover{
    background:#C81E32;
    border-color:#C81E32;
    color:#fff;
    transform:translateY(-1px);
    box-shadow:0 4px 12px rgba(200,30,50,0.25);
}

/* Results */
.ffp-search-results{flex:1;padding:20px 24px;overflow-y:auto;display:flex;flex-direction:column;background:#fff}
.ffp-results-header{margin-bottom:16px}
.ffp-results-count{font-size:14px;color:#777;margin:0;font-weight:400}
.ffp-results-count strong{color:#1a1a1a;font-weight:600}
.ffp-results-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* Product Card - Modern */
.ffp-product-card{
    background:#fff;
    border:1px solid #eee;
    border-radius:12px;
    overflow:hidden;
    text-decoration:none;
    color:inherit;
    display:flex;
    flex-direction:column;
    transition:all 0.25s ease;
    box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
.ffp-product-card:hover{
    border-color:#C81E32;
    transform:translateY(-4px);
    box-shadow:0 12px 24px rgba(200,30,50,0.12);
}

/* Image */
.ffp-product-image{width:100%;height:180px;background:#f8f8f8;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ffp-product-image img{max-width:90%;max-height:160px;width:auto;height:auto;object-fit:contain;transition:transform 0.3s ease}
.ffp-product-card:hover .ffp-product-image img{transform:scale(1.05)}


/* Product Info */
.ffp-product-info{padding:12px 14px;display:flex;flex-direction:column;gap:4px;flex:1}
.ffp-product-title{font-size:13px;font-weight:600;line-height:1.35;color:#1f2937;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ffp-product-brand{font-size:11px;color:#6b7280;font-weight:500;text-transform:uppercase;letter-spacing:0.3px}
.ffp-product-price{font-size:13px;font-weight:700;color:#C81E32}
.ffp-product-price .woocommerce-Price-amount{font-size:13px;font-weight:700;color:#C81E32}
.ffp-product-price del{font-size:11px;color:#9ca3af;font-weight:400}
.ffp-product-price ins{text-decoration:none}
.ffp-product-stock{font-size:11px;font-weight:500;color:#10b981}
.ffp-product-stock.out-of-stock{color:#ef4444}
.ffp-product-stock.backorder{color:#f59e0b}

/* Brand banner — DESKTOP (mobile rules in @media block below) */
.ffp-search-brand-banner{grid-column:1/-1;margin-bottom:12px}
.ffp-search-brand-banner a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;background:#fff;border:1px solid #e5e7eb;border-left:4px solid #c81e32;border-radius:8px;text-decoration:none;transition:transform 0.15s,box-shadow 0.15s}
.ffp-search-brand-banner a:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(200,30,50,0.15)}
.ffp-search-brand-banner .ffp-brand-row-head{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.ffp-search-brand-banner .ffp-brand-row-head img{height:28px;max-width:100px;object-fit:contain;filter:none}
.ffp-search-brand-banner .ffp-brand-meta{display:flex;flex-direction:column;min-width:0}
.ffp-search-brand-banner .ffp-brand-eyebrow{font-size:10px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:#9ca3af}
.ffp-search-brand-banner .ffp-brand-name{font-size:16px;font-weight:700;color:#0a0a0a;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ffp-search-brand-banner .ffp-brand-shop-all{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#c81e32;color:#fff;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;border-radius:4px;white-space:nowrap;flex-shrink:0}

/* Add to Cart Button */
.ffp-add-to-cart{
    display:flex;align-items:center;justify-content:center;gap:6px;
    margin-top:auto;padding:8px 12px;
    background:#C81E32;color:#fff;
    border:none;border-radius:6px;
    font-size:12px;font-weight:600;font-family:inherit;
    cursor:pointer;transition:all 0.2s ease;
    text-decoration:none;
}
.ffp-add-to-cart:hover{background:#a00000;transform:translateY(-1px);box-shadow:0 2px 8px rgba(200,30,50,0.3)}
.ffp-add-to-cart svg{flex-shrink:0}
.ffp-add-to-cart.added{background:#10b981}
.ffp-add-to-cart.adding{opacity:0.7;pointer-events:none}

/* Footer */
.ffp-results-footer{padding:20px 24px;border-top:1px solid #f0f0f0;background:#fafafa;text-align:center}
.ffp-see-all-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    background:linear-gradient(135deg,#C81E32 0%,#a00000 100%);
    color:#fff!important;
    padding:14px 36px;
    border-radius:10px;
    font-weight:600;
    font-size:15px;
    text-decoration:none;
    transition:all 0.25s ease;
    box-shadow:0 4px 14px rgba(200,30,50,0.3);
}
.ffp-see-all-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 20px rgba(200,30,50,0.4);
}

/* Keyboard hints */
.ffp-keyboard-hints{display:flex;gap:20px;justify-content:center;padding:14px;border-top:1px solid #f0f0f0;font-size:12px;color:#666;background:#fafafa}
.ffp-keyboard-hints kbd{background:#e8e8e8;padding:3px 8px;border-radius:5px;font-family:inherit;font-weight:500;color:#555}

/* Swipe hint */
.ffp-swipe-hint{display:none}

/* Loading */
.ffp-loading{display:flex;align-items:center;justify-content:center;padding:60px}
.ffp-loading::after{content:'';width:36px;height:36px;border:3px solid #eee;border-top-color:#C81E32;border-radius:50%;animation:ffp-spin 0.8s linear infinite}
@keyframes ffp-spin{to{transform:rotate(360deg)}}

/* ========== MOBILE ========== */
@media (max-width: 768px) {
    .ffp-search-container{width:100%;max-height:100vh;height:100vh;margin:0;border-radius:0}
    .ffp-search-body{flex-direction:column;min-height:0}
    
    /* Header — flex inline (input + close on same row) */
    .ffp-search-header{padding:14px 16px!important;gap:10px!important}

    /* Search input - keep glow on mobile */
    .ffp-search-input-wrap{padding:12px 14px;border-radius:12px}

    /* Search icon mobile */
    .ffp-search-icon{width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important}

    /* Close button — inline w/ input, 44px touch target, neutral gray w/ red hover */
    .ffp-search-close{
        width:44px!important;
        height:44px!important;
        padding:0!important;
        background:#f3f4f6!important;
        border:1px solid #e5e7eb!important;
        color:#374151!important;
        border-radius:10px!important;
        flex-shrink:0;
    }
    .ffp-search-close:hover, .ffp-search-close:active{background:#fee2e2!important;border-color:#fecaca!important;color:#c81e32!important}
    .ffp-search-close svg{width:18px!important;height:18px!important;stroke:currentColor!important}
    
    /* Sidebar */
    .ffp-search-sidebar{width:100%;box-sizing:border-box;border-right:none;border-bottom:1px solid #f0f0f0;padding:14px 16px;overflow:visible;background:#fafafa}
    .ffp-search-section{margin-bottom:0}
    .ffp-search-section h4{margin-bottom:10px;font-size:10px}
    
    /* Hide filters */
    #ffp-recent-searches,#ffp-vehicle-filters,#ffp-brand-filters{display:none!important}
    
    /* Trending scroll */
    #ffp-popular-list{flex-wrap:nowrap!important;overflow-x:auto!important;padding-bottom:4px;-webkit-overflow-scrolling:touch;gap:10px}
    .ffp-trending-tag{flex-shrink:0;padding:8px 14px;font-size:13px}
    
    /* Results header */
    .ffp-results-header{margin-bottom:10px;display:flex;align-items:center;justify-content:space-between}
    
    /* Swipe hint */
    .ffp-swipe-hint{display:flex!important;align-items:center;gap:4px;font-size:12px;color:#999}
    .ffp-swipe-hint svg{width:16px;height:16px;animation:ffp-swipe 1.5s ease-in-out infinite}
    @keyframes ffp-swipe{0%,100%{transform:translateX(0);opacity:0.5}50%{transform:translateX(4px);opacity:1}}
    
    /* Results — Steeda-style 2-col grid on mobile (was horizontal-scroll carousel) */
    .ffp-search-results{padding:14px 16px;flex:1;box-sizing:border-box}
    .ffp-results-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:12px!important;padding-bottom:8px;overflow:visible!important}
    .ffp-product-card{flex:initial!important;min-width:0!important;width:auto!important;box-shadow:0 2px 10px rgba(0,0,0,0.06);box-sizing:border-box}
    .ffp-product-image{height:130px!important}
    .ffp-product-image img{max-height:120px!important}
    .ffp-product-info{padding:10px 12px;gap:4px}
    .ffp-product-title{font-size:12px;-webkit-line-clamp:2;line-height:1.35}
    .ffp-product-price{font-size:13px}

    /* Brand banner — mobile responsive (stack vertically, full row) */
    .ffp-search-brand-banner{display:block!important;grid-column:1/-1!important;margin-bottom:12px!important;width:100%!important;box-sizing:border-box}
    .ffp-search-brand-banner a{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;padding:14px 16px!important;background:#fff!important;border:1px solid #e5e7eb!important;border-left:3px solid #c81e32!important;border-radius:8px!important;text-decoration:none!important;box-sizing:border-box}
    .ffp-search-brand-banner .ffp-brand-row-head{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important}
    .ffp-search-brand-banner .ffp-brand-row-head img{height:24px!important;max-width:80px!important;object-fit:contain!important;filter:none!important}
    .ffp-search-brand-banner .ffp-brand-meta{display:flex!important;flex-direction:column!important;min-width:0!important;flex:1!important}
    .ffp-search-brand-banner .ffp-brand-eyebrow{font-size:10px!important;font-weight:600!important;letter-spacing:1.2px!important;text-transform:uppercase!important;color:#999!important}
    .ffp-search-brand-banner .ffp-brand-name{font-size:15px!important;font-weight:700!important;color:#0a0a0a!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
    .ffp-search-brand-banner .ffp-brand-shop-all{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;padding:10px 12px!important;background:#c81e32!important;color:#fff!important;font-size:12px!important;font-weight:700!important;letter-spacing:1px!important;text-transform:uppercase!important;border-radius:4px!important}
    .ffp-product-price .woocommerce-Price-amount{font-size:12px}
    .ffp-product-stock{font-size:10px}
    .ffp-add-to-cart{padding:6px 10px;font-size:11px}
    
    #ffp-search-input{font-size:16px}
    .ffp-keyboard-hints{display:none}
    .ffp-results-footer{padding:14px 16px}
    .ffp-see-all-btn{width:100%;padding:14px 24px}
}

/* ================================================
   HOMEPAGE SEARCH BAR TRIGGER STYLING
   ================================================ */

/* Make search wrapper clickable */
.search_wrapper,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper,
.mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper { 
    cursor: pointer !important; 
    position: relative !important;
}

/* Form wrapper - Red glow effect */
.search_wrapper form,
.search_wrapper form.form-searchform,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper form,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper form.form-searchform,
.mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper form { 
    pointer-events: none !important;
    border-radius: 12px !important;
    border: 2px solid #e0e0e0 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(200,30,50,0.08), 0 2px 8px rgba(0,0,0,0.04) !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
}

/* Hover - Red border */
.search_wrapper:hover form,
.search_wrapper:hover form.form-searchform,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper:hover form,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper:hover form.form-searchform,
.mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper:hover form {
    border-color: #C81E32 !important;
    box-shadow: 0 0 0 4px rgba(200,30,50,0.15), 0 4px 12px rgba(0,0,0,0.08) !important;
}

/* Input field - no border */
.search_wrapper input.field,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper input.field,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper form input.field,
.mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper input.field,
.mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper form input.field { 
    cursor: pointer !important;
    border: none !important;
    background: transparent !important;
    font-size: 15px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.search_wrapper input.field::placeholder {
    color: #888 !important;
}

/* Search icon */
.search_wrapper .icon_search,
.search_wrapper .icon_search i,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper .icon_search,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper .icon_search i {
    color: #999 !important;
    transition: color 0.2s !important;
}

/* Search icon on hover - Red */
.search_wrapper:hover .icon_search,
.search_wrapper:hover .icon_search i,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper:hover .icon_search,
.mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper:hover .icon_search i {
    color: #C81E32 !important;
}

/* Ctrl+K badge - Desktop only */
.search_wrapper::after {
    content: 'Ctrl+K';
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 11px;
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 500;
    color: #777;
    pointer-events: none;
    z-index: 10;
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .search_wrapper::after { 
        display: none !important; 
    }
    
    .search_wrapper form,
    .search_wrapper form.form-searchform,
    .mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper form,
    .mcb-section .mcb-wrap .mcb-item-header_search-inner .search_wrapper form.form-searchform,
    .mcb-section .mcb-wrap [class*="mcb-item-"] .search_wrapper form {
        border-radius: 10px !important;
    }
}



/* ================================================
   CONTACT BAR IN SEARCH FOOTER
   ================================================ */

.ffp-contact-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
    font-size: 13px;
}

.ffp-contact-text {
    color: #888;
}

.ffp-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #555 !important;
    text-decoration: none !important;
    padding: 6px 12px;
    border-radius: 6px;
    transition: all 0.2s ease;
    background: #f5f5f5;
}

.ffp-contact-link:hover {
    background: #C81E32 !important;
    color: #fff !important;
}

.ffp-contact-link svg {
    flex-shrink: 0;
}

.ffp-phone-link:hover svg,
.ffp-contact-page-link:hover svg {
    stroke: #fff;
}

/* Mobile: Stack vertically */
@media (max-width: 768px) {
    .ffp-contact-bar {
        flex-direction: column;
        gap: 10px;
    }
    
    .ffp-contact-text {
        font-size: 12px;
    }
    
    .ffp-contact-link {
        padding: 10px 16px;
        font-size: 14px;
    }
}

/* v5.1 - Moved from JS injection to prevent WP Rocket minification breakage */
.ffp-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:ffp-shimmer 1.5s infinite}
@keyframes ffp-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ffp-recent-item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#fff;border:1px solid #e5e7eb;border-radius:6px;margin-bottom:6px;cursor:pointer;transition:all 0.15s}
.ffp-recent-item:hover{border-color:#C81E32;background:#fff5f5}
.ffp-recent-remove{background:none;border:none;color:#9ca3af;cursor:pointer;padding:4px;border-radius:4px;line-height:1}
.ffp-recent-remove:hover{color:#C81E32;background:#fee2e2}
.ffp-kbd{display:inline-block;padding:2px 6px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:4px;font-size:11px;font-family:'Poppins',sans-serif;color:#6b7280}
.ffp-nav-hint{display:flex;align-items:center;gap:12px;justify-content:center;padding:8px;background:#f9fafb;border-top:1px solid #e5e7eb;font-size:12px;color:#6b7280}
.ffp-clear-btn{position:absolute;right:50px;background:none;border:none;color:#9ca3af;cursor:pointer;padding:4px;border-radius:4px;display:none}
.ffp-clear-btn.visible{display:block}
.ffp-clear-btn:hover{color:#C81E32;background:#fee2e2}
.search_wrapper{cursor:pointer!important}
.search_wrapper input{cursor:pointer!important}
.ffp-product-card.focused{outline:2px solid #C81E32!important;outline-offset:2px!important}

/* Focus-visible for keyboard accessibility */
.ffp-trending-tag:focus-visible,.ffp-recent-item:focus-visible,.ffp-see-all-btn:focus-visible,.ffp-add-to-cart:focus-visible,.ffp-search-close:focus-visible,.ffp-contact-link:focus-visible,.ffp-clear-btn:focus-visible{outline:2px solid #C81E32;outline-offset:2px}
.ffp-product-card:focus-visible{outline:2px solid #C81E32;outline-offset:2px}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .ffp-product-card,.ffp-trending-tag,.ffp-add-to-cart,.ffp-see-all-btn,.ffp-search-input-wrap{transition:none!important}
    .ffp-product-card:hover .ffp-product-image img{transform:none!important}
    .ffp-loading::after{animation:none!important;border-top-color:#C81E32}
    .ffp-skeleton{animation:none!important;background:#f0f0f0}
    .ffp-swipe-hint svg{animation:none!important}
}

/* Mobile: scroll fade indicator for results */
@media (max-width: 768px) {
    .ffp-search-results{position:relative}
    .ffp-search-results::after{content:'';position:absolute;right:0;top:0;bottom:0;width:32px;background:linear-gradient(to left,rgba(255,255,255,0.9),transparent);pointer-events:none;z-index:1}
}
