.boom-fp{background:#0b1220;color:#e5ecff;border-radius:16px;padding:16px;border:1px solid #1f2a44;
    /* Prevent find‑part panels from overlapping the mobile sidebar */
    position:relative;
    z-index:0;
    width:100%;
    box-sizing:border-box;
}

.boom-end-note{text-align:center;margin:14px 0;color:#94a3b8;font-size:12px;font-style:italic;}
.boom-fp .boom-fp-filters{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;align-items:end;margin-bottom:12px;position:relative;padding-bottom:56px}
.boom-fp label{display:block;font-size:12px;color:#a9b1c3;margin-bottom:6px}
.boom-wheel-select{background:#11182a;border:1px solid #1f2a44;border-radius:12px;padding:6px;position:relative;overflow:hidden}
.boom-wheel-select select{width:100%;background:transparent;color:#e5ecff;border:0;padding:10px;appearance:none;height:44px}
.boom-wheel{grid-column:span 4}
.boom-fp .boom-fp-filters .boom-fp-search{position:absolute;left:0;right:0;bottom:8px;width:100%;height:44px;border-radius:10px;font-weight:600}
.boom-fp-toolbar{display:flex;justify-content:space-between;align-items:center;background:#0e1629;border:1px solid #1f2a44;border-radius:12px;padding:8px 12px;margin-bottom:8px}
.boom-table-fixed{table-layout:fixed;width:100%;border-collapse:separate;border-spacing:0}
.boom-table-fixed th,.boom-table-fixed td{border-bottom:1px solid #1f2a44;padding:8px 10px;font-size:13px;text-align:left;vertical-align:middle}
.boom-table-fixed thead th{position:sticky;top:0;background:#0e1629;z-index:1}
.boom-table-fixed img{width:56px;height:56px;object-fit:cover;border-radius:8px}
.col-img{width:70px}
.col-name{width:34%}
.col-sku{width:9%}
.col-oem{width:11%}
.col-status{width:9%}
.col-price{width:8%}
.col-your{width:9%}
.col-qty{width:7%}
.col-add{width:6%}
.col-quote{width:6%}
.td-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Display year ranges after product names with a subtle style */
.td-name .years{margin-left:4px;color:#8fa3bf;font-size:11px;font-style:italic;white-space:nowrap;}
.boom-section-row td{border-bottom:0;padding-top:18px;padding-bottom:6px}
.boom-section-title{margin:0;font-size:16px;color:#dbe7ff}
.boom-end-row td{padding:14px 10px;text-align:center;color:#94a3b8;font-size:12px;font-style:italic;background:rgba(15,23,42,.55)}
.status.ok{color:#22c55e}
.status.warn{color:#f59e0b}
.status.warn .tel{color:#f59e0b;text-decoration:underline}
#boom-img-modal{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;align-items:center;justify-content:center;z-index:9999}
#boom-img-modal.show{display:flex}
#boom-img-modal .inner{position:relative;background:#0b1220;padding:10px;border-radius:12px;border:1px solid #1f2a44}
#boom-img-modal img{max-width:90vw;max-height:80vh;display:block;border-radius:8px}
#boom-img-modal .close{position:absolute;top:-10px;right:-10px;background:#11182a;border:1px solid #1f2a44;border-radius:999px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer}

/* Images are clickable (tap-to-zoom) */
.boom-img{cursor:pointer;}

/* Quotes panel readability on dark background */
.boom-quotes{background:#0b1220;border:1px solid #1f2a44;border-radius:16px;padding:16px;color:#e5ecff;box-shadow:0 18px 45px rgba(15,23,42,.5)}
.boom-quotes h2,.boom-quotes h3{color:#e5ecff}
.boom-quotes-table th,.boom-quotes-table td{color:#e5ecff}
.boom-quotes-table a{color:#93c5fd}
.boom-quotes-table .button{border-color:#1f2a44}
.boom-quotes-table tbody tr:nth-child(even){background:rgba(15,23,42,.55)}
.boom-quotes-table tbody tr:hover{background:rgba(30,64,175,.35)}

.boom-end-note{text-align:center;color:#94a3b8;font-size:12px;font-style:italic;margin:12px 0 4px}
@media(max-width: 960px){.boom-wheel{grid-column:span 12}}

/*
 * Mobile X layout styles
 * These styles apply to the special "Mobile X" card layout which displays each product
 * as an individual card. The design takes inspiration from modern e‑commerce apps: white cards
 * on a dark backdrop with rounded corners, subtle shadows, clear typography and minimal
 * ornamentation. The wishlist/heart icon has been intentionally omitted.
 */
@media (max-width: 960px){
    /* Layout container for mobile result cards */
    .boom-x-cards{
        display:flex;
        flex-direction:column;
        gap:16px;
        margin-top:8px;
    }

    /* Category separators (mobile) */
    .boom-x-cat{
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:10px 12px;
        border:1px solid #1f2a44;
        border-radius:12px;
        background:#0b1220;
        color:#e5ecff;
        font-weight:700;
        letter-spacing:.4px;
        text-transform:uppercase;
    }
    .boom-x-cat .cnt{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-width:28px;
        height:22px;
        padding:0 8px;
        border-radius:999px;
        background:#11182a;
        border:1px solid #1f2a44;
        color:#cfe0ff;
        font-size:12px;
        font-weight:700;
    }
    /* Individual product card: dark background, soft border and shadow */
    .boom-x-card{
        display:block;
        padding:16px;
        background:#0b1220;
        border-radius:16px;
        border:1px solid #1f2a44;
        box-shadow:0 4px 15px rgba(15,23,42,0.5);
        color:#e5ecff;
    }

    /* Row 1: image + product name */
    .boom-x-card .x-top{
        display:flex;
        gap:12px;
        align-items:flex-start;
    }
    .boom-x-card .x-img-wrap{flex-shrink:0;}
    .boom-x-card img{
        width:64px;
        height:64px;
        border-radius:12px;
        object-fit:cover;
        cursor:pointer;
    }
    .boom-x-card .x-title{
        flex:1;
        font-size:14px;
        font-weight:600;
        margin:0;
        line-height:1.3;
        color:#e5ecff;
        /* Show full product name on mobile (wrap naturally). */
        white-space:normal;
        overflow:visible;
        display:block;
    }

    /* Rows 2-4 stacked under row 1 */
    .boom-x-card .x-lines{margin-top:10px;display:flex;flex-direction:column;gap:8px;}
    .boom-x-card .x-line{display:flex;align-items:center;flex-wrap:wrap;gap:8px;}

    /* Row 2: SKU - OEM - Status */
    .boom-x-card .x-meta{
        font-size:12px;
        color:#94a3b8;
    }
    .boom-x-card .x-meta .oem::before{content:"\2022\00a0";color:#6b7280;}
    .boom-x-card .x-meta .status{
        margin-left:auto;
        font-size:12px;
        font-weight:500;
        display:flex;
        align-items:center;
    }
    .boom-x-card .x-meta .status.ok{color:#22c55e;}
    .boom-x-card .x-meta .status.warn{color:#f59e0b;}
    .boom-x-card .x-meta .status.warn a{color:#f59e0b;text-decoration:underline;}

    /* Row 3: Public Price - Your Price (same line) */
    /* Prices on mobile: keep everything in one line and do NOT strike-through list price */
    .boom-x-card .x-price-row{font-size:13px;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:8px;white-space:nowrap;}
    .boom-x-card .x-price-row .price-pair{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap;}
    .boom-x-card .x-price-row .price-label{font-size:12px;color:#94a3b8;font-weight:500;white-space:nowrap;}
    .boom-x-card .x-price-row .price{color:#cbd5f5;text-decoration:none;white-space:nowrap;}
    .boom-x-card .x-price-row .price.strike{text-decoration:none;}
    .boom-x-card .x-price-row .your-price{font-size:16px;font-weight:700;color:#ef4444;white-space:nowrap;}

    /* Row 4: Qty - cart icon - quote icon */
    .boom-x-card .x-actions{justify-content:flex-start;}
    .boom-x-card .boom-qty{
        width:60px;
        padding:6px 8px;
        border:1px solid #374151;
        border-radius:8px;
        font-size:14px;
        color:#e5ecff;
        background:#11182a;
    }
    .boom-x-card .boom-add-to-cart{
        width:44px;
        height:44px;
        display:flex;
        align-items:center;
        justify-content:center;
        background:#ef4444;
        color:#ffffff;
        border:0;
        border-radius:8px;
        padding:0;
        font-size:16px;
        cursor:pointer;
    }

    /* When mobile cart button is set to "Text", override the icon-button sizing. */
    .boom-x-card .boom-add-to-cart.boom-add-to-cart-text{
        width:auto;
        flex:1;
        padding:0 14px;
        white-space:nowrap;
        text-align:center;
        font-size:14px;
        font-weight:600;
        border-radius:10px;
    }

    /* Mobile preference: text add-to-cart button */
    .boom-x-card .boom-add-to-cart-text{
        width:auto;
        flex:1;
        height:44px;
        padding:0 14px;
        font-size:14px;
        font-weight:700;
        letter-spacing:0.2px;
        white-space:nowrap;
        border-radius:10px;
        background:#ef4444;
        color:#ffffff;
        display:flex;
        align-items:center;
        justify-content:center;
    }
    .boom-x-card .boom-add-to-cart:hover{
        background:#dc2626;
    }
    .boom-x-card .boom-add-to-quote{
        width:44px;
        height:44px;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:0;
        border:1px solid #374151;
        border-radius:8px;
        background:#1f2937;
        color:#e5ecff;
        cursor:pointer;
    }
    .boom-x-card .boom-add-to-quote:hover{
        background:#374151;
    }
}


/* Image modal (shared) */
.boom-img-modal{position:fixed;inset:0;z-index:99999;}
.boom-img-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);}
.boom-img-modal-inner{position:relative;max-width:min(92vw,720px);max-height:92vh;margin:4vh auto;background:#061a2a;border-radius:16px;box-shadow:0 20px 80px rgba(0,0,0,.55);padding:16px;display:flex;align-items:center;justify-content:center;}
.boom-img-modal-img{max-width:100%;max-height:80vh;border-radius:12px;}
.boom-img-modal-close{position:absolute;top:8px;right:10px;border:0;background:transparent;color:#fff;font-size:28px;line-height:1;cursor:pointer;}