/* =============================================================================
   ЛЕЙБЛЫ ПОДАРКОВ - Ribbon стиль
   
   Использование: <div class="gift-label" data-type="limited" data-tier="3"></div>
   
   data-type: limited | exclusive | nft | crystals | upgradable
   data-tier: 1 | 2 | 3 | 4 | 5 | legendary (необязательно, задаёт цвет)
   ============================================================================= */

/* =========================================================================
   БАЗОВЫЙ КОНТЕЙНЕР
   ========================================================================= */

.gift-label {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 75px;
    height: 75px;
    overflow: hidden;
    z-index: 4;
    pointer-events: none;
    
    filter: 
        drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25))
        drop-shadow(0 4px 6px rgba(0, 0, 0, 0.15));
    
    /* Дефолтный цвет складок - будет переопределяться для tier'ов */
    --fold-color: rgba(0, 0, 0, 0.7);
    
    /* Настройки треугольников (складок) */
    --top-fold-width: 7px;
    --top-fold-height: 4px;
    --top-fold-x: 15px;
    --top-fold-y: 0px;
    --bottom-fold-width: 5px;
    --bottom-fold-height: 7px;
    --bottom-fold-x: -1px;
    --bottom-fold-y: 15px;
}

/* =========================================================================
   ЛЕНТА (::before) - диагональная полоса с текстом
   ========================================================================= */

.gift-label::before {
    content: "label";
    position: absolute;
    top: 12px;
    right: -24px;
    width: 95px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 1;
    text-transform: uppercase;
    transform: rotate(45deg);
    background: linear-gradient(90deg, #f39c12 0%, #e67e22 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
    z-index: 3;
}

/* =========================================================================
   СКЛАДКИ (::after)
   ========================================================================= */

.gift-label::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        linear-gradient(var(--fold-color) 100%, var(--fold-color) 100%),
        linear-gradient(var(--fold-color) 100%, var(--fold-color) 100%);
    background-size: 
        var(--top-fold-width) var(--top-fold-height),
        var(--bottom-fold-width) var(--bottom-fold-height);
    background-position: 
        var(--top-fold-x) var(--top-fold-y),
        calc(100% - var(--bottom-fold-x)) calc(100% - var(--bottom-fold-y));
    background-repeat: no-repeat;
    z-index: 1;
}

/* =========================================================================
   ТИПЫ - текст и базовые цвета (без tier)
   ========================================================================= */

/* Limited - оранжевый */
.gift-label[data-type="limited"]::before { content: "limited"; }
.gift-label[data-type="limited"]:not([data-tier]) { --fold-color: rgba(179, 90, 0, 0.7); }
.gift-label[data-type="limited"]:not([data-tier])::before {
    background: linear-gradient(90deg, #f39c12 0%, #e67e22 100%);
}

/* Exclusive - оранжевый */
.gift-label[data-type="exclusive"]::before { content: "exclusive"; font-size: 7px; }
.gift-label[data-type="exclusive"]:not([data-tier]) { --fold-color: rgba(179, 90, 0, 0.7); }
.gift-label[data-type="exclusive"]:not([data-tier])::before {
    background: linear-gradient(90deg, #f39c12 0%, #e67e22 100%);
}

/* NFT - фиолетовый */
.gift-label[data-type="nft"]::before { 
    content: "NFT"; 
    text-transform: uppercase;
    letter-spacing: 1.2px;
    font-size: 9px;
}
.gift-label[data-type="nft"]:not([data-tier]) { --fold-color: rgba(74, 14, 106, 0.7); }
.gift-label[data-type="nft"]:not([data-tier])::before {
    background: linear-gradient(90deg, #AB47BC 0%, #7B1FA2 100%);
}

/* Crystals - зелёный */
.gift-label[data-type="crystals"]::before { content: "crystals"; font-size: 7px; }
.gift-label[data-type="crystals"]:not([data-tier]) { --fold-color: rgba(13, 51, 16, 0.7); }
.gift-label[data-type="crystals"]:not([data-tier])::before {
    background: linear-gradient(90deg, #2E7D32 0%, #1B5E20 100%);
}

/* Upgradable - зелёный */
.gift-label[data-type="upgradable"]::before { content: "upgradable"; font-size: 6px; }
.gift-label[data-type="upgradable"]:not([data-tier]) { --fold-color: rgba(27, 77, 30, 0.7); }
.gift-label[data-type="upgradable"]:not([data-tier])::before {
    background: linear-gradient(90deg, #4CAF50 0%, #2E7D32 100%);
}

/* =========================================================================
   TIER'Ы - цвета на основе стоимости
   ========================================================================= */

/* Tier 1 - Зелёный */
.gift-label[data-tier="1"] { --fold-color: rgba(27, 94, 32, 0.7); }
.gift-label[data-tier="1"]::before {
    background: linear-gradient(90deg, #4CAF50 0%, #388E3C 100%);
}

/* Tier 2 - Тёмно-зелёный */
.gift-label[data-tier="2"] { --fold-color: rgba(27, 94, 32, 0.7); }
.gift-label[data-tier="2"]::before {
    background: linear-gradient(90deg, #43A047 0%, #2E7D32 100%);
}

/* Tier 3 - Синий */
.gift-label[data-tier="3"] { --fold-color: rgba(1, 87, 155, 0.7); }
.gift-label[data-tier="3"]::before {
    background: linear-gradient(90deg, #29B6F6 0%, #0288D1 100%);
}

/* Tier 4 - Оранжевый */
.gift-label[data-tier="4"] { --fold-color: rgba(230, 81, 0, 0.7); }
.gift-label[data-tier="4"]::before {
    background: linear-gradient(90deg, #FFA726 0%, #F57C00 100%);
}

/* Tier 5 - Фиолетовый */
.gift-label[data-tier="5"] { --fold-color: rgba(74, 0, 114, 0.7); }
.gift-label[data-tier="5"]::before {
    background: linear-gradient(90deg, #AB47BC 0%, #7B1FA2 100%);
}

/* Legendary - Золотой */
.gift-label[data-tier="legendary"] { --fold-color: rgba(191, 108, 0, 0.7); }
.gift-label[data-tier="legendary"]::before {
    background: linear-gradient(90deg, #FFD54F 0%, #FFA000 100%);
    color: #5D4037;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}

/* Legendary текст уменьшен для limited */
.gift-label[data-type="limited"][data-tier="legendary"]::before { 
    content: "legendary"; 
    font-size: 7px; 
}

/* =========================================================================
   ЦЕНОВЫЕ TIER ДЛЯ КАРТОЧЕК
   ========================================================================= */

.gift-price-tier-1,
.gift-price-tier-2,
.gift-price-tier-3,
.gift-price-tier-4,
.gift-price-tier-5,
.gift-price-tier-legendary {
    position: relative;
}

/* =========================================================================
   INFO ИКОНКА ДЛЯ ЭКСКЛЮЗИВНЫХ ПОДАРКОВ
   ========================================================================= */

.gift-info-icon {
    position: absolute;
    top: var(--space-2);
    left: var(--space-2);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-sizing: border-box;
    border: 1px solid transparent;
    background: 
        linear-gradient(var(--color-surface), var(--color-surface)) padding-box,
        linear-gradient(to bottom left, var(--border-gradient-start), var(--border-gradient-end)) border-box;
    color: var(--color-border);
    transition: transform var(--transition-fast);
}

.gift-info-icon:hover {
    transform: scale(1.1);
}

.gift-info-icon svg {
    width: 100%;
    height: 100%;
}
