/* ========================================== */
/* КРАТКОЕ ОГЛАВЛЕНИЕ                         */
/* ========================================== */
/*
 * ФАЙЛ: file-icons.css
 * НАЗНАЧЕНИЕ: Стили для иконок файлов в хранилище
 *
 * СОДЕРЖАНИЕ:
 * 1. .link-card--file - Карточка файла (модификатор для link-card)
 * 2. .file-icon__badge - Бейдж файла (как у текстовых иконок)
 * 3. Адаптивность для мобильных устройств
 *
 * ОСОБЕННОСТИ:
 * - Бейдж в правом нижнем углу (как у текстовых иконок и приложений)
 * - Одинаковый размер для всех типов файлов
 * - Иконка файла (📁) на бейдже
 */
/* ========================================== */

/* ========== КАРТОЧКА ФАЙЛА ========== */
/* Модификатор для обычной карточки ссылки */
.link-card--file {
    position: relative;
}

/* Бейдж файла в правом нижнем углу (как у приложений - белый прямоугольник) */
.file-icon__badge {
    position: absolute;
    bottom: -4px;
    right: -4px;
    background: rgba(255, 255, 255, 0.95);
    color: #039be5;
    border-radius: 4px;
    padding: 1px 1px;
    font-size: 11px;
    font-weight: bold;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    z-index: 10;
    line-height: 1;
    min-width: auto;
    height: auto;
}

/* Бейдж чат-комнаты в правом нижнем углу */
.chat-icon__badge {
    position: absolute;
    bottom: -4px;
    right: -4px;
    background: #1a6b6d;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
    z-index: 10;
    line-height: 1;
}

/* ========== ПРЕВЬЮ ДЛЯ ИЗОБРАЖЕНИЙ ========== */
/* Если файл - изображение, показываем превью */
.link-card--file[data-file-category="image"] .link-card__icon {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* ========== АДАПТИВНОСТЬ ========== */
@media (max-width: 880px) {
    .chat-icon__badge {
        width: 18px;
        height: 18px;
    }
    .file-icon__badge {
        width: 17px;
        height: 14px;
        font-size: 12px;
        padding: 1px 2px;
    }
}

@media (max-width: 490px) {
    .file-icon__badge {
        width: 15px;
        height: 14px;
        font-size: 11px;
        padding: 1px 1px;
    }
}