/* ============================================================
   Search Dropdown Panel + Language Switcher
   Matches Huatai V50 design system
   ============================================================ */

/* Search toggle button */
.search-toggle{
    background:none;border:1px solid var(--line);
    border-radius:50%;width:38px;height:38px;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;color:var(--ink);transition:all .25s ease;
    margin-left:8px;flex-shrink:0;
}
.search-toggle:hover{background:var(--paper);border-color:var(--ink)}
.search-toggle[aria-expanded="true"]{background:var(--dark);color:var(--cream);border-color:var(--dark)}

/* Search panel — slides down from under the header */
.search-panel{
    position:fixed;top:74px;left:0;right:0;z-index:999;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    box-shadow:0 20px 50px -20px rgba(38,54,45,.18);
    max-height:0;overflow:hidden;opacity:0;
    transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s ease,transform .3s ease;
    pointer-events:none;
    transform:translateY(-8px);
}
.search-panel.open{
    max-height:75vh;overflow-y:auto;opacity:1;pointer-events:auto;
    transform:translateY(0);
}

/* Search box row */
.search-box{
    display:flex;align-items:center;gap:16px;
    padding:28px 0 20px;border-bottom:1px solid var(--line);
}

.search-heading{
    font-family:Georgia,serif;font-size:28px;font-weight:400;
    letter-spacing:-.02em;color:var(--ink);margin:0 0 4px;
}
.search-heading em{font-style:normal;color:var(--orange)}
.search-sub{
    font-size:13px;color:var(--muted);margin:0 0 20px;
    display:flex;align-items:center;gap:8px;
}
.search-sub:before{
    content:"";display:inline-block;width:24px;height:2px;background:var(--orange);
}

#search-input{
    flex:1;font-size:20px;border:none;outline:none;
    background:transparent;padding:10px 0;color:var(--ink);
    font-family:Georgia,serif;letter-spacing:-.01em;
}
#search-input::placeholder{color:#b8b3a6;font-family:Arial,sans-serif;font-size:16px}

/* Scope tabs — pill style matching theme buttons */
.search-scope{display:flex;gap:6px;flex-shrink:0}
.scope-tab{
    padding:8px 18px;border-radius:999px;font-size:12px;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;
    cursor:pointer;background:var(--cream);color:var(--muted);
    transition:all .25s ease;border:1px solid transparent;
    display:inline-flex;align-items:center;gap:4px;user-select:none;
}
.scope-tab input{display:none}
.scope-tab:hover{background:#efe9da;color:var(--ink)}
.scope-tab.active{background:var(--dark);color:var(--cream);border-color:var(--dark)}

/* Close button */
.search-close{
    background:var(--cream);border:none;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    width:40px;height:40px;border-radius:50%;
    color:var(--muted);transition:all .25s ease;flex-shrink:0;
}
.search-close:hover{background:var(--dark);color:var(--cream);transform:rotate(90deg)}

/* Search results */
.search-results{padding:8px 0 28px}
.search-results:empty::after{
    content:"";display:block;padding:32px 0;
}
.search-results .search-empty,
.search-results .search-loading,
.search-results .search-error{
    padding:32px 0;text-align:center;color:var(--muted);font-size:14px;
}
.search-results .search-loading{color:var(--orange)}
.search-results .search-error{color:#b5483d}

/* Result item — card style matching theme product cards */
.search-result-item{
    display:flex;gap:16px;padding:16px;
    border:1px solid var(--line);border-radius:14px;
    text-decoration:none;color:inherit;transition:all .25s ease;
    background:var(--paper);margin-bottom:10px;
    position:relative;overflow:hidden;
    opacity:0;transform:translateY(8px);
    animation:searchFadeIn .35s ease forwards;
}
.search-result-item:nth-child(1){animation-delay:.02s}
.search-result-item:nth-child(2){animation-delay:.06s}
.search-result-item:nth-child(3){animation-delay:.10s}
.search-result-item:nth-child(4){animation-delay:.14s}
.search-result-item:nth-child(5){animation-delay:.18s}
.search-result-item:nth-child(6){animation-delay:.22s}
@keyframes searchFadeIn{to{opacity:1;transform:translateY(0)}}
.search-result-item:hover{
    border-color:var(--ink);transform:translateY(-2px);
    box-shadow:0 12px 30px -12px rgba(38,54,45,.18);
}
.search-result-item:last-child{margin-bottom:0}
.search-result-thumb{
    width:72px;height:72px;border-radius:10px;object-fit:cover;
    background:var(--cream);flex-shrink:0;
}
.search-result-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.search-result-type{
    display:inline-block;font-size:10px;font-weight:800;letter-spacing:.1em;
    text-transform:uppercase;padding:3px 10px;border-radius:999px;
    width:fit-content;
}
.search-result-type.product{background:#f4ebd4;color:#8a5c1c}
.search-result-type.article{background:#e3eadf;color:#3d5a3d}
.search-result-title{
    font-family:Georgia,serif;font-size:17px;font-weight:400;line-height:1.35;
    color:var(--ink);margin:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.search-result-desc{
    font-size:13px;color:var(--muted);margin:0;line-height:1.5;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* "See all results" link — pill button style */
.search-view-all{
    display:inline-flex;align-items:center;gap:8px;
    justify-content:center;margin-top:16px;
    padding:12px 24px;border-radius:999px;
    font-weight:700;font-size:13px;letter-spacing:.02em;
    color:var(--dark);text-decoration:none;
    border:1px solid var(--dark);transition:all .25s ease;
    width:fit-content;margin-left:auto;margin-right:auto;
}
.search-view-all:hover{background:var(--dark);color:var(--cream);transform:translateY(-2px)}

/* Language switcher placeholder */
.lang-switcher{display:inline-flex;align-items:center;margin-right:4px}
.lang-placeholder{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:32px;height:32px;padding:0 8px;
    border:1px solid var(--line);border-radius:6px;
    font-size:12px;font-weight:700;color:var(--muted);
    cursor:pointer;transition:all .2s;
}
.lang-placeholder:hover{background:var(--cream);color:var(--ink);border-color:var(--ink)}

/* Responsive */
@media (max-width:768px){
    .search-panel{top:106px}
    .search-box{flex-direction:column;align-items:stretch;gap:14px;padding:20px 0 14px}
    .search-heading{font-size:22px}
    #search-input{font-size:17px}
    .search-scope{width:100%;flex-wrap:wrap;gap:6px}
    .scope-tab{font-size:11px;padding:6px 14px}
    .search-close{position:absolute;top:18px;right:0}
    .search-result-item{padding:12px}
    .search-result-thumb{width:56px;height:56px}
    .search-result-title{font-size:15px;white-space:normal}
    .search-result-desc{white-space:normal}
}