/* Общие стили рамки */
.quick-info-tooltip {
    position: absolute;
    background: white;
    border: 1px solid #000; /* Черная тонкая рамка как на скрине */
    padding: 10px 12px;     /* Внутренние отступы: 10 сверху/снизу, 12 по бокам */
    box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
    z-index: 1000;
    pointer-events: none;
    font-size: 16px;        /* Шрифт чуть меньше, как на макете */
    line-height: 1.4;
    min-width: 150px;
}

/* Убираем лишние отступы у параграфов */
.quick-info-tooltip p {
    margin: 0 0 5px 0;      /* Только маленький отступ снизу */
}


/* Контейнер только для кружочков */
.info-colors {
    display: flex;
    gap: 4px;               /* Расстояние между самими кружками */
}

.preview-dot {
    display: block;         /* Меняем на block для точного позиционирования */
    width: 17px;
    height: 17px;
    border-radius: 50%;
    border: 2px solid #000; /* Обводка кружков */
}

/* Блок размеров */
.info-sizes {
    margin-top: 5px;
}