/* Kinguin Discount Integration Styles */

/* Kinguin Brand Colors */
:root {
    --kinguin-primary: #ff6b35;
    --kinguin-secondary: #4a4a4a;
    --kinguin-accent: #ffd700;
    --kinguin-dark: #2c2c2c;
}

/* Discount Banner Styling */
.kinguin-discount-banner {
    background: linear-gradient(135deg, #8b5cf6 0%, #ff6b35 100%);
    border: 2px solid var(--kinguin-accent);
    animation: kinguin-glow 3s ease-in-out infinite alternate;
    position: relative;
    overflow: hidden;
}

.kinguin-discount-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    animation: kinguin-shine 3s infinite;
}

@keyframes kinguin-glow {
    0% { box-shadow: 0 0 5px rgba(255, 107, 53, 0.5); }
    100% { box-shadow: 0 0 20px rgba(255, 107, 53, 0.8), 0 0 30px rgba(255, 215, 0, 0.3); }
}

@keyframes kinguin-shine {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Kinguin Code Styling */
.kinguin-code {
    background: rgba(0, 0, 0, 0.4) !important;
    border: 1px solid var(--kinguin-accent);
    color: var(--kinguin-accent) !important;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    letter-spacing: 1px;
    padding: 0.5rem 1rem !important;
    border-radius: 6px;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
}

.kinguin-code:hover {
    background: rgba(255, 215, 0, 0.2) !important;
    transform: scale(1.05);
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.7);
}

/* Kinguin Icons */
.kinguin-crown {
    color: var(--kinguin-accent);
    filter: drop-shadow(0 0 5px rgba(255, 215, 0, 0.7));
    animation: kinguin-crown-pulse 2s ease-in-out infinite;
}

@keyframes kinguin-crown-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.kinguin-tag {
    color: var(--kinguin-primary);
    filter: drop-shadow(0 0 3px rgba(255, 107, 53, 0.5));
}

/* Vendor Card Kinguin Highlighting */
.vendor-row.kinguin-vendor {
    border-left: 4px solid var(--kinguin-primary);
    background: linear-gradient(90deg, rgba(255, 107, 53, 0.1) 0%, transparent 100%);
    position: relative;
}

.vendor-row.kinguin-vendor::before {
    content: 'DISCOUNT AVAILABLE';
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: var(--kinguin-primary);
    color: white;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.vendor-row.kinguin-vendor .buy-btn {
    background: linear-gradient(135deg, var(--kinguin-primary) 0%, #ff8f65 100%) !important;
    border: 1px solid var(--kinguin-accent);
    position: relative;
    overflow: hidden;
}

.vendor-row.kinguin-vendor .buy-btn::after {
    content: 'Use INGAME5 for 5% off';
    position: absolute;
    bottom: -25px;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.9);
    color: var(--kinguin-accent);
    font-size: 0.7rem;
    font-weight: bold;
    text-align: center;
    padding: 0.3rem;
    transition: bottom 0.3s ease;
}

.vendor-row.kinguin-vendor .buy-btn:hover::after {
    bottom: 0;
}

/* Kinguin Logo/Icon Styling */
.kinguin-icon {
    color: var(--kinguin-primary) !important;
    filter: drop-shadow(0 0 5px rgba(255, 107, 53, 0.5));
}

/* Discount Code Copy Functionality */
.discount-code-copy {
    position: relative;
    display: inline-block;
}

.discount-code-copy::after {
    content: 'Click to copy';
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
    font-size: 0.7rem;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    white-space: nowrap;
}

.discount-code-copy:hover::after {
    opacity: 1;
}

.discount-code-copy.copied::after {
    content: 'Copied!';
    opacity: 1;
    color: var(--kinguin-accent);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .kinguin-discount-banner {
        margin: 1rem 0;
        padding: 1rem !important;
    }
    
    .kinguin-discount-banner .flex {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .kinguin-code {
        padding: 0.4rem 0.8rem !important;
        font-size: 0.9rem;
    }
    
    .vendor-row.kinguin-vendor::before {
        font-size: 0.6rem;
        padding: 0.15rem 0.4rem;
        top: 0.3rem;
        right: 0.3rem;
    }
}

/* Accessibility */
.kinguin-discount-banner:focus-within {
    outline: 2px solid var(--kinguin-accent);
    outline-offset: 2px;
}

.kinguin-code:focus {
    outline: 2px solid var(--kinguin-accent);
    outline-offset: 2px;
}

/* Print Styles */
@media print {
    .kinguin-discount-banner,
    .vendor-row.kinguin-vendor::before,
    .vendor-row.kinguin-vendor .buy-btn::after {
        display: none;
    }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .kinguin-discount-banner {
        border-width: 3px;
        background: #000;
        color: #fff;
    }
    
    .kinguin-code {
        border-width: 2px;
        background: #000 !important;
        color: #fff !important;
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .kinguin-discount-banner,
    .kinguin-crown,
    .kinguin-discount-banner::before {
        animation: none;
    }
    
    .kinguin-code:hover {
        transform: none;
    }
}
