/*h1::first-letter, h2::first-letter, h3::first-letter {*/
/*    background: linear-gradient(to right, var(--colors-purple-600), black);*/
/*    !*background: linear-gradient(to right, #6600ad, black);*!*/
/*    !*background: linear-gradient(to right, oklch(54.6% 0.245 262.881), black);*!*/
/*    -webkit-background-clip: text;*/
/*    color: transparent;*/
/*}*/


/* Component styling */
#autocomplete {
    margin: 0 auto;
}

#autocomplete .aa-Form {
    /*border: 1px solid darkred;*/
    border-radius: 16px;
    max-width: 140px;
    transition: max-width 0.3s ease;
}

#autocomplete .aa-Form:focus-within,
#autocomplete .aa-Input:focus {
    max-width: 325px;
}

.aa-Panel {
    z-index: 100;
    max-width: 300px !important; /* or whatever width you need */
    width: 100% !important;
}

.aa-ItemIcon {
    margin-right: 12px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border-radius: 6px;
    font-size: 18px;
}

.aa-ItemIcon img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 6px;
}

.aa-ItemContent {
    display: flex;
    align-items: center;
    padding: 4px;
}

.aa-ItemContentBody {
    flex: 1;
    min-width: 0;
}

.aa-ItemContentTitle {
    font-weight: 600;
    margin-bottom: 4px;
    color: #1a1a1a;
}

.aa-ItemContentDescription {
    color: #666;
    font-size: 0.85em;
    line-height: 1.4;
}

.aa-ItemWrapper:hover {
    background-color: #f8f9fa;
}

/* Highlight styling */
.aa-ItemContentTitle mark,
.aa-ItemContentTitle em {
    background: #ffe066 !important;
    color: inherit;
    font-weight: 700;
    font-style: normal;
}

/* Blur effect applied to body */
/*body.blur-active {*/
/*    filter: blur(3px);*/
/*    pointer-events: none; !* Prevent interaction with blurred content *!*/
/*    transition: filter 0.1s ease-in-out; !* Smooth transition *!*/
/*}*/

/* Ensuring the input field stays unblurred */
/*#autocomplete {*/
/*    position: relative; !* Positioning it to stay above *!*/
/*    z-index: 1000; !* Make sure it's above the blurred content *!*/
/*}*/



/* Add backdrop-filter blur when input is focused */
/*body::before {*/
/*    content: '';*/
/*    position: fixed;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    backdrop-filter: blur(0px);*/
/*    background: rgba(0, 0, 0, 0);*/
/*    pointer-events: none;*/
/*    transition: backdrop-filter 0.3s, background 0.3s;*/
/*    z-index: 10;*/
/*}*/

/*body.input-focused::before {*/
/*    backdrop-filter: blur(5px);*/
/*    background: rgba(0, 0, 0, 0.3);*/
/*}*/

/*#autocomplete input {*/
/*    position: relative;*/
/*    z-index: 20; !* Keep input above blur *!*/
/*}*/