/* Spotlight search — estilos standalone (no dependen de Tailwind) */

/* Botón "Buscar" en header */
.sps-trigger{
    display:inline-flex;align-items:center;gap:.5rem;
    background:transparent;border:0;padding:.4rem .75rem;cursor:pointer;
    font-size:.875rem;font-weight:500;color:#3f3f46;
    transition:color .15s ease;
}
.sps-trigger:hover{color:var(--sps-primary,#2563eb)}
.sps-trigger svg{width:1.25rem;height:1.25rem}

/* Variante desktop-only (oculta en móvil) */
.sps-trigger.sps-desktop{display:none}
@media (min-width: 1024px){
    .sps-trigger.sps-desktop{display:inline-flex}
}

/* Overlay */
.sps-overlay{
    position:fixed;inset:0;z-index:9999;
    display:none;
}
.sps-overlay.is-open{display:block}
.sps-overlay-bg{
    position:absolute;inset:0;background:rgba(0,0,0,.5);
    backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
}

/* Diálogo */
.sps-dialog{
    position:relative;max-width:48rem;margin:6rem auto 0 auto;
    background:#fff;border-radius:1rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);
    padding:1.5rem;border:1px solid #e4e4e7;z-index:1;
    width:calc(100% - 2rem);
}
.sps-dialog-head{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:.75rem;
}
.sps-dialog-head h2{
    font-size:1.125rem;font-weight:600;color:#27272a;margin:0;
}
.sps-close-btn{
    background:transparent;border:0;padding:.25rem;cursor:pointer;color:#71717a;
    transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center;
}
.sps-close-btn:hover{color:var(--sps-primary,#2563eb)}
.sps-close-btn svg{width:1.25rem;height:1.25rem}

/* Form */
.sps-form{position:relative}
.sps-input{
    width:100%;background:#f8fafc;border:1px solid #e4e4e7;border-radius:.75rem;
    padding:.75rem 2.75rem .75rem .75rem;font-size:1rem;outline:none;
    color:#0f172a;
    transition:border-color .15s ease,box-shadow .15s ease;
    box-sizing:border-box;
}
.sps-input:focus{
    border-color:var(--sps-primary,#2563eb);
    box-shadow:0 0 0 3px rgba(37,99,235,.2);
}
.sps-submit{
    position:absolute;right:.5rem;top:50%;transform:translateY(-50%);
    background:transparent;border:0;padding:.25rem;cursor:pointer;color:#71717a;
    display:inline-flex;align-items:center;justify-content:center;
    transition:color .15s ease;
}
.sps-submit:hover{color:var(--sps-primary,#2563eb)}
.sps-submit svg{width:1.25rem;height:1.25rem}

/* Resultados */
.sps-results{
    display:none;margin-top:1rem;border:1px solid #e4e4e7;border-radius:.75rem;
    max-height:24rem;overflow:auto;background:#fff;
}
.sps-results.is-visible{display:block}
.sps-results ul{list-style:none;margin:0;padding:0}
.sps-results li + li{border-top:1px solid #f4f4f5}
.sps-results a{
    display:flex;flex-direction:column;gap:.25rem;
    padding:.75rem 1rem;text-decoration:none;
    transition:background-color .12s ease;
}
.sps-results a:hover{background:#f8fafc}
.sps-result-title{font-weight:500;color:#18181b}
.sps-result-type{
    font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#71717a;
}
.sps-empty,.sps-error{
    padding:.75rem 1rem;font-size:.875rem;
}
.sps-empty{color:#71717a}
.sps-error{color:#ef4444}

/* Footer */
.sps-foot{margin-top:.75rem;text-align:right}
.sps-foot button{
    background:transparent;border:0;font-size:.875rem;color:#71717a;cursor:pointer;
    transition:color .15s ease;
}
.sps-foot button:hover{color:var(--sps-primary,#2563eb)}

/* Body lock */
body.sps-locked{overflow:hidden}

/* Responsive */
@media (max-width: 640px){
    .sps-dialog{margin-top:3rem;padding:1rem}
    .sps-dialog-head h2{font-size:1rem}
}