/**
 * JLITS DropDown - Minimal custom styles.
 *
 * Bootstrap handles all standard form control styling. This file provides
 * only the positioning, result item styling, and thumbnail sizing needed
 * by the dropdown component.
 *
 * All custom classes use the `.jlits-dropdown-` prefix to avoid collisions
 * with Bootstrap's own classes and to provide version-agnostic targeting
 * for the JavaScript component.
 *
 * @package   jlits/dropdown
 * @author    JL IT Solutions
 * @copyright 2024-2026 JL IT Solutions. All rights reserved.
 * @version   1.2.0
 * @since     1.0.0
 * @date      2026-02-07
 */

/* Container */
.jlits-dropdown {
    position: relative;
}

/* Results dropdown */
.jlits-dropdown-results {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-top: none;
    border-radius: 0 0 0.375rem 0.375rem;
    max-height: 300px;
    overflow-y: auto;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Individual result item */
.jlits-dropdown-item {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    border-bottom: 1px solid #f0f0f0;
}

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

.jlits-dropdown-item:hover,
.jlits-dropdown-item--active {
    background-color: #f8f9fa;
}

/* Thumbnail */
.jlits-dropdown-thumb {
    width: 28px;
    height: 28px;
    object-fit: cover;
    border-radius: 4px;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

/* Label */
.jlits-dropdown-label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Clear button */
.jlits-dropdown-clear {
    cursor: pointer;
    user-select: none;
}

/* State messages */
.jlits-dropdown-message {
    padding: 0.75rem;
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
}