/**
 * WC Smart Search Pro — Styles
 * Design matches reference: flat list with "Type: Label" format
 *
 * @package WC Smart Search Pro
 */

/* =========================================================================
   Search Input — loading state
   ========================================================================= */

input[name="s"].wcss-loading {
    opacity: 0.65;
    cursor:  wait;
}

/* =========================================================================
   Autocomplete Dropdown
   Matches reference design: simple bordered box, black hover
   ========================================================================= */

.wc-autocomplete {
    position:      absolute;
    background:    #fff;
    border:        1px solid #ddd;
    z-index:       999999;
    max-height:    320px;
    overflow-y:    auto;
    box-shadow:    0 6px 18px rgba(0, 0, 0, 0.10);

    /* Mobile: don't overflow screen */
    max-width:     calc(100vw - 20px);
    box-sizing:    border-box;
}

/* Each suggestion row */
.wc-item {
    padding:     10px 14px;
    cursor:      pointer;
    font-size:   14px;
    color:       #1d1d1d;
    line-height: 1.4;
    border-bottom: 1px solid #f2f2f2;
    white-space: nowrap;
    overflow:    hidden;
    text-overflow: ellipsis;
}

.wc-item:last-child {
    border-bottom: none;
}

/* Hover + keyboard active — black bg, white text (matches reference) */
.wc-item:hover,
.wc-item.wc-item-active {
    background: #000;
    color:      #fff;
}

.wc-item:hover mark,
.wc-item.wc-item-active mark {
    background: transparent;
    color:      #fff;
    font-weight: 700;
}

/* Label: "Category:" bold prefix */
.wc-item strong {
    font-weight: 600;
    margin-right: 2px;
}

/* Highlighted match portion */
.wc-item mark {
    background:  transparent;
    color:       #2c3e9e;
    font-weight: 700;
    padding:     0;
}

/* Scrollbar */
.wc-autocomplete::-webkit-scrollbar       { width: 4px; }
.wc-autocomplete::-webkit-scrollbar-track { background: transparent; }
.wc-autocomplete::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; }

/* =========================================================================
   Mobile adjustments
   ========================================================================= */

@media (max-width: 600px) {
    .wc-autocomplete {
        left:      10px !important;
        right:     10px !important;
        width:     auto !important;
        font-size: 15px;
    }

    .wc-item {
        padding:    12px 14px;
        font-size:  15px;
        white-space: normal;
    }
}

/* =========================================================================
   Admin — index progress + analytics stats
   ========================================================================= */

.wcss-index-progress {
    background:    #fff;
    border:        1px solid #c3c4c7;
    border-radius: 4px;
    padding:       14px 18px;
    margin:        12px 0;
}

.wcss-index-progress progress {
    width:      100%;
    height:     8px;
    margin-top: 6px;
}

.wcss-analytics .wcss-stats-row {
    display:   flex;
    gap:       20px;
    margin:    20px 0;
    flex-wrap: wrap;
}

.wcss-analytics .wcss-stat-box {
    background:    #fff;
    border:        1px solid #c3c4c7;
    border-radius: 4px;
    padding:       20px 30px;
    text-align:    center;
    min-width:     160px;
}

.wcss-analytics .wcss-stat-box h3 {
    margin:         0 0 8px;
    font-size:      12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color:          #646970;
}

.wcss-analytics .wcss-stat-box .wcss-num {
    font-size:   36px;
    font-weight: 700;
    color:       #1d2327;
    line-height: 1;
}