/* Smart Search Bar Pro — Frontend */
.ssbp-front{
    font-family:var(--ssbp-font,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);
    background:var(--ssbp-bg,#fff);
    border:1.5px solid var(--ssbp-border,#e2e8f0);
    border-radius:var(--ssbp-radius,16px);
    padding:var(--ssbp-pad,20px);
    box-shadow:var(--ssbp-shadow,0 4px 20px rgba(0,0,0,.08));
    color:var(--ssbp-text,#1e293b);
    box-sizing:border-box;
}
.ssbp-front *{box-sizing:border-box}

/* Filters grid */
.ssbp-filters{display:grid;grid-template-columns:var(--ssbp-fcols,repeat(auto-fit,minmax(180px,1fr)));gap:var(--ssbp-gap,12px);margin-bottom:var(--ssbp-gap,12px)}

.ssbp-lbl{display:block;font-size:var(--ssbp-label-size,11px);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ssbp-label,#64748b);margin-bottom:4px}

.ssbp-sel{
    width:100%;
    height:var(--ssbp-sel-h,42px);
    border:1.5px solid var(--ssbp-border,#e2e8f0);
    border-radius:var(--ssbp-sel-r,8px);
    font-size:var(--ssbp-sel-size,14px);
    padding:0 28px 0 10px;
    background-color:var(--ssbp-bg,#fff);
    color:var(--ssbp-text,#1e293b);
    cursor:pointer;
    appearance:none;-webkit-appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 9px center;
    transition:border-color .2s,box-shadow .2s;outline:none;
}
.ssbp-sel:focus{border-color:var(--ssbp-primary,#6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--ssbp-primary,#6366f1) 15%,transparent)}
.ssbp-sel:hover{border-color:var(--ssbp-primary,#6366f1)}
.ssbp-sel:disabled{opacity:.45;cursor:not-allowed}
input.ssbp-sel{background-image:none;padding:0 10px}

/* Filter tags */
.ssbp-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--ssbp-gap,12px);min-height:4px}
.ssbp-tag{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--ssbp-tag-bg,#eef2ff);border-radius:100px;font-size:12px;font-weight:600;color:var(--ssbp-tag-color,#6366f1);animation:ssbpTagIn .2s ease}
@keyframes ssbpTagIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
.ssbp-tag-x{background:none;border:none;cursor:pointer;color:inherit;font-size:.85rem;padding:0;opacity:.7;line-height:1}
.ssbp-tag-x:hover{opacity:1}

/* Search row */
.ssbp-search-row{display:flex;gap:var(--ssbp-gap,12px)}
.ssbp-inp-wrap{flex:1;position:relative}
.ssbp-ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);pointer-events:none;font-size:1rem}
.ssbp-inp{
    width:100%;height:var(--ssbp-btn-h,46px);
    border:1.5px solid var(--ssbp-border,#e2e8f0);
    border-radius:var(--ssbp-sel-r,8px);
    font-size:var(--ssbp-inp-size,15px);
    padding:0 12px 0 36px;
    color:var(--ssbp-text,#1e293b);
    outline:none;
    transition:border-color .2s,box-shadow .2s;
    background:var(--ssbp-bg,#fff);
}
.ssbp-inp:focus{border-color:var(--ssbp-primary,#6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--ssbp-primary,#6366f1) 15%,transparent)}
.ssbp-inp::placeholder{color:#cbd5e1}

.ssbp-btn{
    height:var(--ssbp-btn-h,46px);
    padding:0 22px;
    background:var(--ssbp-primary,#6366f1);
    color:var(--ssbp-btn-text,#fff);
    border:none;
    border-radius:var(--ssbp-btn-r,10px);
    font-size:var(--ssbp-btn-size,15px);
    font-weight:700;
    cursor:pointer;
    white-space:nowrap;
    transition:background .2s,transform .15s,box-shadow .2s;
}
.ssbp-btn:hover{background:var(--ssbp-primary-hover,#4f46e5);transform:translateY(-2px);box-shadow:0 6px 18px color-mix(in srgb,var(--ssbp-primary,#6366f1) 40%,transparent)}
.ssbp-btn:active{transform:translateY(0)}

/* Loading */
.ssbp-loading{text-align:center;padding:1.5rem}
.ssbp-spinner{display:inline-block;width:30px;height:30px;border:3px solid #f1f5f9;border-top-color:var(--ssbp-primary,#6366f1);border-radius:50%;animation:ssbpSpin .7s linear infinite}
@keyframes ssbpSpin{to{transform:rotate(360deg)}}

/* Results */
.ssbp-results-area{margin-top:var(--ssbp-gap,12px)}
.ssbp-results-hdr{font-size:.8rem;color:var(--ssbp-label,#64748b);margin-bottom:var(--ssbp-gap,12px);font-weight:600}
.ssbp-results-hdr strong{color:var(--ssbp-primary,#6366f1)}
.ssbp-results-grid{display:grid;grid-template-columns:var(--ssbp-rcols,1fr);gap:var(--ssbp-gap,12px)}

.ssbp-rcard{
    display:block;text-decoration:none;color:inherit;
    background:var(--ssbp-result-bg,#f8fafc);
    border:1.5px solid var(--ssbp-result-border,#e2e8f0);
    border-radius:var(--ssbp-res-r,10px);
    padding:12px 14px;
    transition:border-color .2s,box-shadow .2s,transform .2s;
    animation:ssbpCardIn .25s ease forwards;
    opacity:0;
}
.ssbp-rcard:hover{border-color:var(--ssbp-result-hover,#6366f1);box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-2px);text-decoration:none;color:inherit}
@keyframes ssbpCardIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ssbp-rcard-badge{font-size:var(--ssbp-res-desc,13px);color:var(--ssbp-primary,#6366f1);font-weight:700;margin-bottom:4px}
.ssbp-rcard-title{font-size:var(--ssbp-res-title,15px);font-weight:700;color:var(--ssbp-text,#1e293b)}
.ssbp-rcard-desc{font-size:var(--ssbp-res-desc,13px);color:var(--ssbp-label,#64748b);margin-top:3px}
.ssbp-rcard-loc{font-size:calc(var(--ssbp-res-desc,13px) - 1px);color:var(--ssbp-primary,#6366f1);margin-top:6px}

/* No results */
.ssbp-none{text-align:center;padding:2rem 1rem;color:#94a3b8}
.ssbp-none span{font-size:2rem;display:block;margin-bottom:.5rem}
.ssbp-none p{font-size:.88rem;margin:0}

/* Responsive */
@media(max-width:560px){
    .ssbp-filters{grid-template-columns:1fr!important}
    .ssbp-search-row{flex-direction:column}
    .ssbp-btn{width:100%}
}