/* КРИТИЧЕСКОЕ ПЕРЕОПРЕДЕЛЕНИЕ ВСЕХ СТИЛЕЙ ПЛАШЕК */
/* Этот файл должен быть подключен последним для гарантированного применения */

/* Удаляем все конфликтующие стили */
.float-card {
    all: unset !important; /* Сброс всех стилей */
    
    /* Базовые стили заново */
    position: absolute !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    
    /* Размеры - компактные и фиксированные */
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 12px !important;
    
    /* Визуальные стили */
    background: linear-gradient(135deg, #FFD700, #FFA500) !important;
    border-radius: 15px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    
    /* Типографика */
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    white-space: nowrap !important;
    line-height: 30px !important; /* Равна высоте для вертикального центрирования */
    
    /* Дополнительно */
    overflow: hidden !important;
    cursor: default !important;
    user-select: none !important;
    -webkit-font-smoothing: antialiased !important;
}

/* Иконки внутри плашек */
.float-card i,
.float-card .fas,
.float-card .far,
.float-card .fab {
    all: unset !important;
    font-family: 'Font Awesome 6 Free' !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    color: #000000 !important;
    display: inline-block !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Текст внутри плашек */
.float-card span {
    all: unset !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    display: inline-block !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Убираем все отступы у вложенных элементов */
.float-card * {
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

/* Специфичные позиции для каждой плашки */
.floating-cards .float-card:nth-child(1),
.float-card:nth-of-type(1) {
    top: 20% !important;
    left: -50px !important;
    animation: gentle-float-1 4s ease-in-out infinite !important;
}

.floating-cards .float-card:nth-child(2),
.float-card:nth-of-type(2) {
    top: 50% !important;
    right: -40px !important;
    animation: gentle-float-2 4.5s ease-in-out infinite !important;
}

.floating-cards .float-card:nth-child(3),
.float-card:nth-of-type(3) {
    bottom: 25% !important;
    left: -30px !important;
    animation: gentle-float-3 5s ease-in-out infinite !important;
}

/* Мягкая анимация */
@keyframes gentle-float-1 {
    0%, 100% { 
        transform: translateY(0) translateX(0) rotate(-2deg); 
    }
    50% { 
        transform: translateY(-8px) translateX(3px) rotate(1deg); 
    }
}

@keyframes gentle-float-2 {
    0%, 100% { 
        transform: translateY(0) translateX(0) rotate(2deg); 
    }
    50% { 
        transform: translateY(-10px) translateX(-3px) rotate(-1deg); 
    }
}

@keyframes gentle-float-3 {
    0%, 100% { 
        transform: translateY(0) translateX(0) rotate(-1deg); 
    }
    50% { 
        transform: translateY(-6px) translateX(2px) rotate(2deg); 
    }
}

/* Hover эффект только на десктопе */
@media (hover: hover) and (pointer: fine) {
    .float-card {
        transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    }
    
    .float-card:hover {
        transform: scale(1.05) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
        animation-play-state: paused !important;
    }
}

/* Полное скрытие на мобильных устройствах */
@media (max-width: 768px) {
    .float-card,
    .floating-cards,
    .hero-visual .float-card,
    .hero-visual .floating-cards {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
    }
}

/* Принудительное применение для всех возможных селекторов */
body .float-card,
body .hero .float-card,
body .hero-visual .float-card,
body .floating-cards .float-card,
body div.float-card,
html body .float-card {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 12px !important;
    line-height: 30px !important;
}

/* Убеждаемся что контейнер плашек не мешает */
.floating-cards {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

.floating-cards .float-card {
    pointer-events: auto !important;
}