/* Infomac Buyback — Catalog CSS v6.1 */
.imb-catalog-plugin {
    --cat-blue: #1367e8;
    --cat-blue-dark: #0f56c2;
    --cat-text: #0f172a;
    --cat-muted: #5b6475;
    --cat-border: #dbe2ea;
    --cat-card: #fff;
    --cat-bg: #f8fafc;
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 16px;
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--cat-text);
}
.imb-catalog-plugin * { box-sizing: border-box; }

/* ── Toolbar ── */
.imb-cat-toolbar {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.imb-cat-search {
    flex: 1;
    min-width: 220px;
    border: 1.5px solid var(--cat-border);
    border-radius: 14px;
    padding: 12px 16px;
    font-size: 15px;
    outline: none;
    background: #fff;
}
.imb-cat-search:focus { border-color: var(--cat-blue); box-shadow: 0 0 0 4px rgba(19,103,232,.1); }
.imb-cat-count { font-size: 13px; color: var(--cat-muted); white-space: nowrap; }

/* ── Layout ── */
.imb-cat-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 20px;
    align-items: start;
}
@media (max-width: 900px) { .imb-cat-layout { grid-template-columns: 1fr; } }

/* ── Sidebar ── */
.imb-cat-sidebar {
    background: var(--cat-card);
    border: 1px solid var(--cat-border);
    border-radius: 20px;
    padding: 20px;
    position: sticky;
    top: 20px;
}
.imb-cat-section + .imb-cat-section { margin-top: 20px; border-top: 1px solid var(--cat-border); padding-top: 20px; }
.imb-cat-section h3 { font-size: 13px; font-weight: 700; color: #445066; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .04em; }

/* ── Category buttons ── */
.imb-cat-categories { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.imb-cat-btn {
    border: 1px solid var(--cat-border);
    border-radius: 14px;
    padding: 12px 8px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    transition: all .18s;
    color: var(--cat-text);
}
.imb-cat-btn:hover { border-color: var(--cat-blue); }
.imb-cat-btn.active { border-color: var(--cat-blue); background: #eef5ff; color: var(--cat-blue); }

/* ── Brand buttons ── */
.imb-cat-brands { display: flex; flex-wrap: wrap; gap: 8px; }
.imb-cat-brand-btn {
    border: 1px solid var(--cat-border);
    border-radius: 999px;
    padding: 7px 14px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all .18s;
    color: var(--cat-text);
}
.imb-cat-brand-btn:hover { border-color: var(--cat-blue); }
.imb-cat-brand-btn.active { background: var(--cat-blue); color: #fff; border-color: var(--cat-blue); }

/* ── Grid ── */
.imb-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
@media (max-width: 1100px) { .imb-cat-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .imb-cat-grid { grid-template-columns: 1fr; } }

.imb-cat-card {
    background: var(--cat-card);
    border: 1px solid var(--cat-border);
    border-radius: 20px;
    overflow: hidden;
    transition: transform .2s, box-shadow .2s;
}
.imb-cat-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(15,23,42,.09); }

.imb-cat-img-wrap {
    aspect-ratio: 4/3;
    background: var(--cat-bg);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.imb-cat-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.imb-cat-no-img {
    font-size: 2.5rem;
    font-weight: 800;
    color: #c1cad6;
}

.imb-cat-card-body { padding: 16px; }
.imb-cat-ref {
    display: inline-flex;
    padding: 5px 10px;
    border-radius: 999px;
    background: #f1f5f9;
    font-size: 11px;
    font-weight: 700;
    color: #495467;
    margin-bottom: 8px;
}
.imb-cat-card-body h3 { font-size: 1rem; font-weight: 700; margin: 0 0 10px; line-height: 1.3; }
.imb-cat-prices { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.imb-cat-price-pill {
    padding: 5px 10px;
    background: #eef5ff;
    border-radius: 999px;
    font-size: 12px;
    color: #2255aa;
}
.imb-cat-price-pill strong { font-weight: 700; }

.imb-cat-cta {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 10px;
    background: #0f172a;
    color: #fff;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background .18s;
}
.imb-cat-cta:hover { background: var(--cat-blue); color: #fff; }

.imb-cat-empty {
    padding: 32px;
    text-align: center;
    color: var(--cat-muted);
    border: 1.5px dashed var(--cat-border);
    border-radius: 20px;
}