@import '_content/BlazorDateRangePicker/BlazorDateRangePicker.iitr8bszy4.bundle.scp.css';

/* /Pages/CancelPayment.razor.rz.scp.css */
/* CancelPayment.razor.css - Scoped styles for Cancel Payment page */

.cancel-payment-section[b-bklep852ko] {
    padding: 60px 0 80px;
    min-height: 60vh;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
}

.cancel-payment-container[b-bklep852ko] {
    max-width: 800px;
    margin: 0 auto;
    animation: fadeInUp-b-bklep852ko 0.6s ease-out;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

@keyframes fadeInUp-b-bklep852ko {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.cancel-payment-header[b-bklep852ko] {
    text-align: center;
    margin-bottom: 40px;
}

.cancel-payment-icon-wrapper[b-bklep852ko] {
    margin-bottom: 24px;
    display: inline-block;
}

.cancel-payment-x-icon[b-bklep852ko] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: block;
    stroke-width: 3;
    stroke: #ef4444;
    stroke-miterlimit: 10;
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
    animation: scale-b-bklep852ko 0.3s ease-in-out 0.9s both, pulse-red-b-bklep852ko 2s ease-in-out 1.2s infinite;
}

@keyframes scale-b-bklep852ko {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }
}

@keyframes pulse-red-b-bklep852ko {
    0% {
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
    }
}

.cancel-payment-circle[b-bklep852ko] {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 3;
    stroke-miterlimit: 10;
    stroke: #ef4444;
    fill: none;
    animation: stroke-b-bklep852ko 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.cancel-payment-x[b-bklep852ko] {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke-b-bklep852ko 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke-b-bklep852ko {
    100% {
        stroke-dashoffset: 0;
    }
}

.cancel-payment-title[b-bklep852ko] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--color-header);
    margin-bottom: 12px;
    line-height: 1.2;
}

.cancel-payment-subtitle[b-bklep852ko] {
    font-size: 1.125rem;
    color: var(--color-text);
    margin: 0;
}

.cancel-payment-card[b-bklep852ko] {
    background: var(--bg-secondary);
    border-radius: 16px;
    padding: 32px;
    margin-bottom: 24px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-color);
    transition: box-shadow 0.3s ease;
    width: 100%;
    max-width: 800px;
}

.cancel-payment-card:hover[b-bklep852ko] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.cancel-payment-card-title[b-bklep852ko] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 24px 0;
}

.cancel-payment-card-title svg[b-bklep852ko] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.cancel-payment-reasons[b-bklep852ko] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cancel-payment-reason[b-bklep852ko] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 16px;
    background: var(--bg-tertiary);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.cancel-payment-reason:hover[b-bklep852ko] {
    background: var(--bg-primary);
    transform: translateX(4px);
}

.cancel-payment-reason svg[b-bklep852ko] {
    color: var(--color-primary);
    flex-shrink: 0;
    margin-top: 2px;
}

.cancel-payment-reason strong[b-bklep852ko] {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-header);
    margin-bottom: 4px;
}

.cancel-payment-reason p[b-bklep852ko] {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.5;
}

.cancel-payment-tips[b-bklep852ko] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cancel-payment-tips li[b-bklep852ko] {
    padding-left: 28px;
    position: relative;
    font-size: 0.95rem;
    color: var(--color-text);
    line-height: 1.6;
}

.cancel-payment-tips li[b-bklep852ko]::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--color-primary);
    font-weight: 700;
    font-size: 1.1rem;
}

.cancel-payment-trust[b-bklep852ko] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin: 32px 0;
    padding: 24px;
    background: var(--bg-secondary);
    border-radius: 12px;
    border: 2px solid var(--border-color);
    width: 100%;
    max-width: 800px;
}

.cancel-payment-trust-badge[b-bklep852ko] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--bg-tertiary);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-header);
    transition: all 0.3s ease;
}

.cancel-payment-trust-badge:hover[b-bklep852ko] {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.15);
    transform: translateY(-2px);
}

.cancel-payment-trust-badge svg[b-bklep852ko] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.cancel-payment-actions[b-bklep852ko] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    width: 100%;
    max-width: 800px;
    margin-top: 8px;
}

.btn-primary[b-bklep852ko],
.btn-secondary[b-bklep852ko],
.btn-discord[b-bklep852ko] {
    padding: 14px 32px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
    min-height: 44px;
    justify-content: center;
}

.btn-primary[b-bklep852ko] {
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    color: #ffffff;
    border: none;
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.25);
}

.btn-primary:hover[b-bklep852ko] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(255, 135, 73, 0.35);
}

.btn-secondary[b-bklep852ko] {
    background: var(--bg-secondary);
    color: var(--color-header);
    border: 2px solid var(--border-color);
}

.btn-secondary:hover[b-bklep852ko] {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-2px);
}

.btn-discord[b-bklep852ko] {
    background: #5865F2;
    color: #ffffff;
    border: none;
}

.btn-discord:hover[b-bklep852ko] {
    background: #4752C4;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
}

.btn-discord svg[b-bklep852ko] {
    width: 20px;
    height: 20px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .cancel-payment-section[b-bklep852ko] {
        padding: 40px 0 60px;
    }

    .cancel-payment-title[b-bklep852ko] {
        font-size: 2rem;
    }

    .cancel-payment-card[b-bklep852ko] {
        padding: 24px 20px;
    }

    .cancel-payment-card-title[b-bklep852ko] {
        font-size: 1.25rem;
    }

    .cancel-payment-actions[b-bklep852ko] {
        flex-direction: column;
    }

    .btn-primary[b-bklep852ko],
    .btn-secondary[b-bklep852ko],
    .btn-discord[b-bklep852ko] {
        width: 100%;
    }

    .cancel-payment-trust[b-bklep852ko] {
        flex-direction: column;
        align-items: stretch;
    }

    .cancel-payment-trust-badge[b-bklep852ko] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .cancel-payment-title[b-bklep852ko] {
        font-size: 1.75rem;
    }

    .cancel-payment-subtitle[b-bklep852ko] {
        font-size: 1rem;
    }

    .cancel-payment-card[b-bklep852ko] {
        padding: 20px 16px;
    }
}
/* /Pages/Contact.razor.rz.scp.css */
.contact-page-section[b-dxwvtqvo1m] {
        padding: 60px 0 80px;
        min-height: 60vh;
        display: flex;
        justify-content: center;
        align-items: flex-start;
        width: 100%;
    }

    .contact-discord-banner[b-dxwvtqvo1m] {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 20px 24px;
        background: linear-gradient(135deg, rgba(88, 101, 242, 0.1) 0%, rgba(88, 101, 242, 0.05) 100%);
        border: 2px solid rgba(88, 101, 242, 0.2);
        border-radius: 12px;
        margin-bottom: 40px;
        width: 100%;
        max-width: 900px;
    }

    .contact-discord-banner svg[b-dxwvtqvo1m] {
        color: #5865F2;
        flex-shrink: 0;
    }

    .contact-discord-banner strong[b-dxwvtqvo1m] {
        display: block;
        font-size: 1rem;
        font-weight: 600;
        color: var(--color-header);
        margin-bottom: 4px;
    }

    .contact-discord-banner p[b-dxwvtqvo1m] {
        font-size: 0.9rem;
        color: var(--text-primary);
        margin: 0;
    }

    .contact-discord-banner > div[b-dxwvtqvo1m] {
        flex: 1;
    }

    .contact-discord-btn[b-dxwvtqvo1m] {
        padding: 10px 20px;
        background: #5865F2;
        color: #ffffff;
        border-radius: 8px;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.9rem;
        transition: all 0.3s ease;
        white-space: nowrap;
    }

    .contact-discord-btn:hover[b-dxwvtqvo1m] {
        background: #4752C4;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
    }

    .contact-form-container[b-dxwvtqvo1m] {
        background: var(--bg-secondary);
        border-radius: 16px;
        padding: 32px;
        margin-bottom: 40px;
        box-shadow: var(--shadow-sm);
        border: 1px solid var(--border-color);
        width: 100%;
        max-width: 900px;
    }

    .contact-form-header[b-dxwvtqvo1m] {
        margin-bottom: 24px;
        padding-bottom: 20px;
        border-bottom: 2px solid var(--border-color);
    }

    .contact-form-header h2[b-dxwvtqvo1m] {
        font-size: 1.5rem;
        font-weight: 600;
        color: var(--color-header);
        margin: 0 0 8px 0;
    }

    .contact-response-time[b-dxwvtqvo1m] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.9rem;
        color: var(--text-primary);
        margin: 0;
    }

    .contact-response-time svg[b-dxwvtqvo1m] {
        color: var(--color-primary);
    }

    .contact-form-row[b-dxwvtqvo1m] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        margin-bottom: 20px;
    }

    .contact-form-group[b-dxwvtqvo1m] {
        margin-bottom: 20px;
    }

    .contact-form-label[b-dxwvtqvo1m] {
        display: block;
        font-size: 0.9rem;
        font-weight: 600;
        color: var(--color-header);
        margin-bottom: 8px;
    }

    .contact-form-input[b-dxwvtqvo1m] {
        width: 100%;
        padding: 12px 16px;
        border: 2px solid var(--border-color);
        border-radius: 8px;
        font-size: 1rem;
        font-family: 'Montserrat', sans-serif;
        transition: all 0.3s;
        background: var(--bg-tertiary);
        color: var(--text-secondary);
    }

    .contact-form-input:focus[b-dxwvtqvo1m] {
        outline: none;
        border-color: var(--color-primary);
        box-shadow: 0 0 0 3px rgba(255, 135, 73, 0.1);
    }

    .contact-form-input.--error[b-dxwvtqvo1m] {
        border-color: #dc3545;
    }

    .contact-form-textarea[b-dxwvtqvo1m] {
        resize: none;
        min-height: 120px;
        max-height: 400px;
        overflow-y: auto;
        font-family: 'Montserrat', sans-serif;
        transition: height 0.2s ease;
    }

    .contact-form-error[b-dxwvtqvo1m] {
        display: block;
        color: #dc3545;
        font-size: 0.85rem;
        margin-top: 6px;
    }

    .contact-form-error-message[b-dxwvtqvo1m] {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 16px;
        background: #fef2f2;
        border: 1px solid #fecaca;
        border-radius: 8px;
        color: #991b1b;
        margin-bottom: 20px;
        font-size: 0.9rem;
    }

    .contact-form-error-message svg[b-dxwvtqvo1m] {
        flex-shrink: 0;
    }

    .contact-form-footer[b-dxwvtqvo1m] {
        margin-top: 24px;
    }

    .contact-form-spinner[b-dxwvtqvo1m] {
        width: 16px;
        height: 16px;
        border: 2px solid rgba(255, 255, 255, 0.3);
        border-top-color: #FFFFFF;
        border-radius: 50%;
        animation: spin-b-dxwvtqvo1m 0.8s linear infinite;
        display: inline-block;
        margin-right: 8px;
        vertical-align: middle;
    }

    @keyframes spin-b-dxwvtqvo1m {
        to { transform: rotate(360deg); }
    }

    /* Success State */
    .contact-success-container[b-dxwvtqvo1m] {
        background: var(--bg-secondary);
        border-radius: 16px;
        padding: 48px 32px;
        margin-bottom: 40px;
        box-shadow: var(--shadow-sm);
        border: 1px solid var(--border-color);
        text-align: center;
        animation: fadeInUp-b-dxwvtqvo1m 0.6s ease-out;
        width: 100%;
        max-width: 900px;
    }

    @keyframes fadeInUp-b-dxwvtqvo1m {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .contact-success-header[b-dxwvtqvo1m] {
        margin-bottom: 32px;
    }

    .contact-success-icon-wrapper[b-dxwvtqvo1m] {
        margin-bottom: 24px;
        display: inline-block;
    }

    .contact-success-checkmark[b-dxwvtqvo1m] {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        display: block;
        stroke-width: 3;
        stroke: #22c55e;
        stroke-miterlimit: 10;
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4);
        animation: scale-b-dxwvtqvo1m 0.3s ease-in-out 0.9s both, pulse-green-b-dxwvtqvo1m 2s ease-in-out 1.2s infinite;
    }

    @keyframes scale-b-dxwvtqvo1m {
        0%, 100% {
            transform: scale(1);
        }
        50% {
            transform: scale(1.1);
        }
    }

    @keyframes pulse-green-b-dxwvtqvo1m {
        0% {
            box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4);
        }
        70% {
            box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
        }
        100% {
            box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
        }
    }

    .contact-success-circle[b-dxwvtqvo1m] {
        stroke-dasharray: 166;
        stroke-dashoffset: 166;
        stroke-width: 3;
        stroke-miterlimit: 10;
        stroke: #22c55e;
        fill: none;
        animation: stroke-b-dxwvtqvo1m 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
    }

    .contact-success-check[b-dxwvtqvo1m] {
        transform-origin: 50% 50%;
        stroke-dasharray: 48;
        stroke-dashoffset: 48;
        animation: stroke-b-dxwvtqvo1m 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
    }

    @keyframes stroke-b-dxwvtqvo1m {
        100% {
            stroke-dashoffset: 0;
        }
    }

    .contact-success-title[b-dxwvtqvo1m] {
        font-size: 2rem;
        font-weight: 700;
        color: var(--color-header);
        margin-bottom: 12px;
    }

    .contact-success-subtitle[b-dxwvtqvo1m] {
        font-size: 1.125rem;
        color: var(--color-text);
        margin: 0;
    }

    .contact-success-actions[b-dxwvtqvo1m] {
        display: flex;
        gap: 16px;
        justify-content: center;
        flex-wrap: wrap;
    }

    .btn-primary[b-dxwvtqvo1m],
    .btn-discord[b-dxwvtqvo1m] {
        padding: 14px 32px;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 600;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        transition: all 0.3s ease;
        min-height: 44px;
        justify-content: center;
        border: none;
        cursor: pointer;
    }

    .btn-primary[b-dxwvtqvo1m] {
        background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
        color: #ffffff;
        box-shadow: 0 4px 12px rgba(255, 135, 73, 0.25);
    }

    .btn-primary:hover:not(:disabled)[b-dxwvtqvo1m] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(255, 135, 73, 0.35);
    }

    .btn-primary:disabled[b-dxwvtqvo1m] {
        opacity: 0.7;
        cursor: not-allowed;
    }

    .btn-discord[b-dxwvtqvo1m] {
        background: #5865F2;
        color: #ffffff;
    }

    .btn-discord:hover[b-dxwvtqvo1m] {
        background: #4752C4;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
    }

    .btn-discord svg[b-dxwvtqvo1m] {
        width: 20px;
        height: 20px;
    }

    /* FAQ Section */
    .contact-faq-section[b-dxwvtqvo1m] {
        background: var(--bg-secondary);
        border-radius: 16px;
        padding: 32px;
        box-shadow: var(--shadow-sm);
        border: 1px solid var(--border-color);
        width: 100%;
        max-width: 900px;
    }

    .contact-faq-title[b-dxwvtqvo1m] {
        font-size: 1.5rem;
        font-weight: 600;
        color: var(--color-header);
        margin: 0 0 24px 0;
    }

    .contact-faq-list[b-dxwvtqvo1m] {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .contact-faq-item[b-dxwvtqvo1m] {
        border: 1px solid var(--border-color);
        border-radius: 8px;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .contact-faq-item:hover[b-dxwvtqvo1m] {
        border-color: var(--color-primary);
    }

    .contact-faq-question[b-dxwvtqvo1m] {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        background: var(--bg-tertiary);
        border: none;
        text-align: left;
        font-size: 1rem;
        font-weight: 600;
        color: var(--text-secondary);
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .contact-faq-question:hover[b-dxwvtqvo1m] {
        background: var(--bg-primary);
    }

    .contact-faq-question svg[b-dxwvtqvo1m] {
        color: var(--color-primary);
        transition: transform 0.3s ease;
        flex-shrink: 0;
    }

    .contact-faq-icon-open[b-dxwvtqvo1m] {
        transform: rotate(180deg);
    }

    .contact-faq-answer[b-dxwvtqvo1m] {
        padding: 16px 20px;
        background: var(--bg-secondary);
        color: var(--text-primary);
        line-height: 1.6;
        animation: slideDown-b-dxwvtqvo1m 0.3s ease-out;
    }

    @keyframes slideDown-b-dxwvtqvo1m {
        from {
            opacity: 0;
            max-height: 0;
        }
        to {
            opacity: 1;
            max-height: 200px;
        }
    }

    .contact-faq-answer p[b-dxwvtqvo1m] {
        margin: 0;
    }

    /* Responsive Design */
    @media (max-width: 768px) {
        .contact-page-section[b-dxwvtqvo1m] {
            padding: 40px 0 60px;
        }

        .contact-discord-banner[b-dxwvtqvo1m] {
            flex-direction: column;
            align-items: flex-start;
            text-align: left;
        }

        .contact-discord-btn[b-dxwvtqvo1m] {
            width: 100%;
            text-align: center;
        }

        .contact-form-container[b-dxwvtqvo1m],
        .contact-faq-section[b-dxwvtqvo1m] {
            padding: 24px 20px;
        }

        .contact-form-row[b-dxwvtqvo1m] {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .contact-success-container[b-dxwvtqvo1m] {
            padding: 32px 20px;
        }

        .contact-success-title[b-dxwvtqvo1m] {
            font-size: 1.5rem;
        }

        .contact-success-actions[b-dxwvtqvo1m] {
            flex-direction: column;
        }

        .btn-primary[b-dxwvtqvo1m],
        .btn-discord[b-dxwvtqvo1m] {
            width: 100%;
        }
    }

    @media (max-width: 480px) {
        .contact-form-container[b-dxwvtqvo1m],
        .contact-faq-section[b-dxwvtqvo1m] {
            padding: 20px 16px;
        }

        .contact-success-container[b-dxwvtqvo1m] {
            padding: 24px 16px;
        }
    }
/* /Pages/Error404.razor.rz.scp.css */
/* Error404.razor.css - Scoped styles for 404 Error page */

.error-404-section[b-jst0xey5no] {
    padding: 60px 0 80px;
    min-height: 70vh;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
}

.error-404-container[b-jst0xey5no] {
    max-width: 1000px;
    margin: 0 auto;
    animation: fadeInUp-b-jst0xey5no 0.6s ease-out;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

@keyframes fadeInUp-b-jst0xey5no {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.error-404-header[b-jst0xey5no] {
    text-align: center;
    margin-bottom: 40px;
}

.error-404-number[b-jst0xey5no] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.error-404-digit[b-jst0xey5no] {
    font-size: 8rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    animation: bounceIn-b-jst0xey5no 0.8s ease-out;
    display: inline-block;
}

.error-404-digit:nth-child(1)[b-jst0xey5no] {
    animation-delay: 0.1s;
}

.error-404-digit:nth-child(2)[b-jst0xey5no] {
    animation-delay: 0.2s;
}

.error-404-digit:nth-child(3)[b-jst0xey5no] {
    animation-delay: 0.3s;
}

@keyframes bounceIn-b-jst0xey5no {
    0% {
        opacity: 0;
        transform: scale(0.3) translateY(-50px);
    }

    50% {
        opacity: 1;
        transform: scale(1.05);
    }

    70% {
        transform: scale(0.9);
    }

    100% {
        transform: scale(1);
    }
}

.error-404-title[b-jst0xey5no] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--color-header);
    margin-bottom: 12px;
    line-height: 1.2;
}

.error-404-subtitle[b-jst0xey5no] {
    font-size: 1.125rem;
    color: var(--color-text);
    margin: 0;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.error-404-actions[b-jst0xey5no] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    width: 100%;
    margin-bottom: 60px;
}

.btn-primary[b-jst0xey5no],
.btn-secondary[b-jst0xey5no],
.btn-discord[b-jst0xey5no] {
    padding: 14px 32px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
    min-height: 44px;
    justify-content: center;
}

.btn-primary[b-jst0xey5no] {
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    color: #ffffff;
    border: none;
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.25);
}

.btn-primary:hover[b-jst0xey5no] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(255, 135, 73, 0.35);
}

.btn-secondary[b-jst0xey5no] {
    background: var(--bg-secondary);
    color: var(--color-header);
    border: 2px solid var(--border-color);
}

.btn-secondary:hover[b-jst0xey5no] {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-2px);
}

.btn-discord[b-jst0xey5no] {
    background: #5865F2;
    color: #ffffff;
    border: none;
}

.btn-discord:hover[b-jst0xey5no] {
    background: #4752C4;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
}

.btn-discord svg[b-jst0xey5no] {
    width: 20px;
    height: 20px;
}

.error-404-popular[b-jst0xey5no] {
    width: 100%;
    margin-bottom: 40px;
}

.error-404-popular-title[b-jst0xey5no] {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 24px 0;
    text-align: center;
}

.error-404-grid[b-jst0xey5no] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.error-404-card[b-jst0xey5no] {
    background: var(--bg-secondary);
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-color);
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.3s ease;
}

.error-404-card:hover[b-jst0xey5no] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
    border-color: var(--color-primary);
}

.error-404-card-icon[b-jst0xey5no] {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(255, 135, 73, 0.2);
}

.error-404-card-icon svg[b-jst0xey5no] {
    color: #ffffff;
}

.error-404-card-content h3[b-jst0xey5no] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 6px 0;
}

.error-404-card-content p[b-jst0xey5no] {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.5;
}

.error-404-accounts[b-jst0xey5no] {
    width: 100%;
    background: var(--bg-secondary);
    border-radius: 16px;
    padding: 32px;
    border: 1px solid var(--border-color);
}

.error-404-account-links[b-jst0xey5no] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.error-404-account-link[b-jst0xey5no] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--bg-tertiary);
    border: 2px solid var(--border-color);
    border-radius: 8px;
    text-decoration: none;
    color: var(--color-header);
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.error-404-account-link:hover[b-jst0xey5no] {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.15);
}

.error-404-account-link svg[b-jst0xey5no] {
    color: var(--color-primary);
}

/* Responsive Design */
@media (max-width: 768px) {
    .error-404-section[b-jst0xey5no] {
        padding: 40px 0 60px;
    }

    .error-404-digit[b-jst0xey5no] {
        font-size: 5rem;
    }

    .error-404-title[b-jst0xey5no] {
        font-size: 2rem;
    }

    .error-404-subtitle[b-jst0xey5no] {
        font-size: 1rem;
    }

    .error-404-actions[b-jst0xey5no] {
        flex-direction: column;
        margin-bottom: 40px;
    }

    .btn-primary[b-jst0xey5no],
    .btn-secondary[b-jst0xey5no],
    .btn-discord[b-jst0xey5no] {
        width: 100%;
    }

    .error-404-grid[b-jst0xey5no] {
        grid-template-columns: 1fr;
    }

    .error-404-accounts[b-jst0xey5no] {
        padding: 24px 20px;
    }

    .error-404-account-links[b-jst0xey5no] {
        flex-direction: column;
    }

    .error-404-account-link[b-jst0xey5no] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .error-404-digit[b-jst0xey5no] {
        font-size: 4rem;
    }

    .error-404-title[b-jst0xey5no] {
        font-size: 1.75rem;
    }

    .error-404-card[b-jst0xey5no] {
        padding: 20px;
    }

    .error-404-card-icon[b-jst0xey5no] {
        width: 40px;
        height: 40px;
    }

    .error-404-card-icon svg[b-jst0xey5no] {
        width: 20px;
        height: 20px;
    }

    .error-404-accounts[b-jst0xey5no] {
        padding: 20px 16px;
    }
}

/* ============================================
   Minigame Styles
   ============================================ */
.error-404-game[b-jst0xey5no] {
    margin-top: 50px;
    text-align: center;
    width: 100%;
}

.error-404-game-subtitle[b-jst0xey5no] {
    color: var(--color-text);
    opacity: 0.7;
    margin-bottom: 25px;
    font-size: 16px;
}

.error-404-game-container[b-jst0xey5no] {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    border-radius: 20px;
    padding: 25px;
    border: 1px solid rgba(79, 203, 205, 0.2);
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.4);
    max-width: 370px;
    margin: 0 auto;
}

#shroom-dodge-canvas[b-jst0xey5no] {
    display: block;
    border-radius: 12px;
    background: #0f172a;
    border: 1px solid rgba(79, 203, 205, 0.1);
}

.error-404-game-btn[b-jst0xey5no] {
    margin-top: 20px;
    padding: 14px 40px;
    background: linear-gradient(135deg, #4FCBCD 0%, #3bb3b5 100%);
    color: #0f172a;
    border: none;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(79, 203, 205, 0.3);
}

.error-404-game-btn:hover[b-jst0xey5no] {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 25px rgba(79, 203, 205, 0.5);
}

.error-404-game-btn:active[b-jst0xey5no] {
    transform: translateY(0);
}

@media (max-width: 480px) {
    .error-404-game-container[b-jst0xey5no] {
        padding: 20px 15px;
        max-width: 320px;
    }

    #shroom-dodge-canvas[b-jst0xey5no] {
        width: 280px;
        height: 350px;
    }

    .error-404-game-btn[b-jst0xey5no] {
        padding: 12px 30px;
        font-size: 16px;
    }
}
/* /Pages/Faq.razor.rz.scp.css */
/* Faq.razor.css - Scoped styles for FAQ page */

.faqs-section[b-oohsstjs42] {
    padding: 60px 0 80px;
    min-height: 60vh;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    animation: fadeInUp-b-oohsstjs42 0.6s ease-out;
}

@keyframes fadeInUp-b-oohsstjs42 {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.faqs-main-title[b-oohsstjs42] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--color-header);
    margin-bottom: 50px;
    text-align: center;
    line-height: 1.2;
}

.faqs-category[b-oohsstjs42] {
    width: 100%;
    max-width: 900px;
    margin-bottom: 50px;
    animation: fadeInUp-b-oohsstjs42 0.6s ease-out;
}

.faqs-category-title[b-oohsstjs42] {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--color-header);
    margin-bottom: 24px;
    text-align: center;
    padding-bottom: 16px;
    border-bottom: 2px solid var(--border-color);
}

.faqs-list[b-oohsstjs42] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faqs-item[b-oohsstjs42] {
    background: var(--bg-secondary);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-sm);
}

.faqs-item:hover[b-oohsstjs42] {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.15);
    transform: translateY(-2px);
}

.faqs-question[b-oohsstjs42] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    background: var(--bg-tertiary);
    border: none;
    text-align: left;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.3s ease;
}

.faqs-question:hover[b-oohsstjs42] {
    background: var(--bg-primary);
}

.faqs-question span[b-oohsstjs42] {
    flex: 1;
    padding-right: 16px;
}

.faqs-question svg[b-oohsstjs42] {
    color: var(--color-primary);
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.faqs-icon-open[b-oohsstjs42] {
    transform: rotate(180deg);
}

.faqs-answer[b-oohsstjs42] {
    padding: 20px 24px;
    background: var(--bg-secondary);
    color: var(--text-primary);
    line-height: 1.7;
    animation: slideDown-b-oohsstjs42 0.3s ease-out;
    border-top: 1px solid var(--border-color);
}

@keyframes slideDown-b-oohsstjs42 {
    from {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    to {
        opacity: 1;
        max-height: 500px;
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

.faqs-answer p[b-oohsstjs42] {
    margin: 0 0 12px 0;
}

.faqs-answer p:last-child[b-oohsstjs42] {
    margin-bottom: 0;
}

.faqs-answer ul[b-oohsstjs42] {
    margin: 12px 0;
    padding-left: 24px;
    list-style-type: disc;
}

.faqs-answer li[b-oohsstjs42] {
    margin-bottom: 8px;
    line-height: 1.6;
}

.faqs-answer a[b-oohsstjs42] {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.faqs-answer a:hover[b-oohsstjs42] {
    color: #FF6B2B;
    text-decoration: underline;
}

.faqs-answer strong[b-oohsstjs42] {
    color: var(--color-header);
    font-weight: 600;
}

/* Responsive Design */
@media (max-width: 768px) {
    .faqs-section[b-oohsstjs42] {
        padding: 40px 0 60px;
    }

    .faqs-main-title[b-oohsstjs42] {
        font-size: 2rem;
        margin-bottom: 40px;
    }

    .faqs-category-title[b-oohsstjs42] {
        font-size: 1.5rem;
    }

    .faqs-question[b-oohsstjs42] {
        padding: 16px 20px;
        font-size: 1rem;
    }

    .faqs-answer[b-oohsstjs42] {
        padding: 16px 20px;
    }

    .faqs-category[b-oohsstjs42] {
        margin-bottom: 40px;
    }
}

@media (max-width: 480px) {
    .faqs-main-title[b-oohsstjs42] {
        font-size: 1.75rem;
    }

    .faqs-category-title[b-oohsstjs42] {
        font-size: 1.25rem;
    }

    .faqs-question[b-oohsstjs42] {
        padding: 14px 16px;
        font-size: 0.95rem;
    }

    .faqs-answer[b-oohsstjs42] {
        padding: 14px 16px;
        font-size: 0.9rem;
    }
}
/* /Pages/GiftReveal.razor.rz.scp.css */
/* ============================================
   Gift Reveal Page Styles
   ============================================ */
.gift-reveal-section[b-trd0ofax8r] {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    width: 100%;
}

.gift-reveal-section .container[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* Loading State */
.gift-loading[b-trd0ofax8r] {
    text-align: center;
    padding: 60px 40px;
    background: var(--bg-secondary, #1e293b);
    border-radius: 20px;
    border: 1px solid var(--border-color, rgba(255, 255, 255, 0.1));
}

.gift-loading__spinner[b-trd0ofax8r] {
    width: 50px;
    height: 50px;
    border: 4px solid rgba(79, 203, 205, 0.2);
    border-top-color: #4FCBCD;
    border-radius: 50%;
    animation: spin-b-trd0ofax8r 1s linear infinite;
    margin: 0 auto 20px;
}

@keyframes spin-b-trd0ofax8r {
    to {
        transform: rotate(360deg);
    }
}

/* Invalid Gift */
.gift-invalid[b-trd0ofax8r] {
    text-align: center;
    padding: 60px 50px;
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%);
    border-radius: 24px;
    border: 1px solid rgba(239, 68, 68, 0.3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    max-width: 450px;
    margin: 0 auto;
}

.gift-invalid__icon[b-trd0ofax8r] {
    font-size: 80px;
    margin-bottom: 25px;
    display: block;
}

.gift-invalid h1[b-trd0ofax8r] {
    color: #ef4444;
    margin-bottom: 15px;
    font-size: 28px;
    font-weight: 700;
}

.gift-invalid p[b-trd0ofax8r] {
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 35px;
}

.gift-invalid .btn-primary[b-trd0ofax8r] {
    display: inline-block;
    padding: 14px 32px;
    background: linear-gradient(135deg, #4FCBCD 0%, #3bb3b5 100%);
    color: #0f172a;
    font-weight: 600;
    font-size: 16px;
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.gift-invalid .btn-primary:hover[b-trd0ofax8r] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(79, 203, 205, 0.4);
}

/* Gift Box */
.gift-box-container[b-trd0ofax8r] {
    text-align: center;
}

.gift-title[b-trd0ofax8r] {
    font-size: 32px;
    color: var(--color-header);
    margin-bottom: 10px;
}

.gift-subtitle[b-trd0ofax8r] {
    color: var(--color-text);
    opacity: 0.7;
    margin-bottom: 40px;
}

.gift-box[b-trd0ofax8r] {
    position: relative;
    width: 200px;
    height: 200px;
    margin: 0 auto 30px;
    cursor: pointer;
    perspective: 1000px;
}

.gift-box__base[b-trd0ofax8r] {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 120px;
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(185, 28, 28, 0.3);
}

.gift-box__ribbon[b-trd0ofax8r] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 100%;
    background: linear-gradient(90deg, #fbbf24 0%, #f59e0b 50%, #fbbf24 100%);
}

.gift-box__lid[b-trd0ofax8r] {
    position: absolute;
    top: 40px;
    width: 100%;
    height: 50px;
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    border-radius: 10px 10px 0 0;
    transform-origin: bottom center;
    transition: transform 0.5s ease;
    z-index: 1;
}

.gift-box__bow[b-trd0ofax8r] {
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 40px;
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    border-radius: 50%;
}

.gift-box__bow[b-trd0ofax8r]::before,
.gift-box__bow[b-trd0ofax8r]::after {
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    border-radius: 50%;
    top: 10px;
}

.gift-box__bow[b-trd0ofax8r]::before {
    left: -10px;
}

.gift-box__bow[b-trd0ofax8r]::after {
    right: -10px;
}

.gift-box__glow[b-trd0ofax8r] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 250px;
    height: 250px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(251, 191, 36, 0.2) 0%, transparent 70%);
    animation: pulse-glow 2s ease-in-out infinite;
    pointer-events: none;
}

/* Opening Animation */
.gift-box--opening .gift-box__lid[b-trd0ofax8r] {
    animation: lidOpen-b-trd0ofax8r 0.5s ease forwards;
}

.gift-box--opening .gift-box__glow[b-trd0ofax8r] {
    animation: glowBurst-b-trd0ofax8r 1.5s ease forwards;
}

@keyframes lidOpen-b-trd0ofax8r {
    0% {
        transform: rotateX(0deg);
    }

    100% {
        transform: rotateX(-120deg) translateY(-30px);
    }
}

@keyframes glowBurst-b-trd0ofax8r {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.3;
    }

    50% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 1;
    }

    100% {
        transform: translate(-50%, -50%) scale(3);
        opacity: 0;
    }
}

.gift-tap-hint[b-trd0ofax8r] {
    color: #f59e0b;
    font-weight: 600;
    animation: blink 1.5s ease-in-out infinite;
}

/* Revealed State */
.gift-revealed[b-trd0ofax8r] {
    text-align: center;
    max-width: 500px;
    margin: 0 auto;
    animation: fadeInUp-b-trd0ofax8r 0.5s ease;
}

.gift-revealed__header[b-trd0ofax8r] {
    margin-bottom: 30px;
}

.gift-revealed__icon[b-trd0ofax8r] {
    font-size: 64px;
    margin-bottom: 15px;
}

.gift-revealed__header h1[b-trd0ofax8r] {
    color: var(--color-header);
    font-size: 32px;
    margin-bottom: 10px;
}

.gift-revealed__header p[b-trd0ofax8r] {
    color: var(--color-text);
    opacity: 0.7;
}

/* Account Info Banner */
.gift-revealed__info[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    background: linear-gradient(135deg, rgba(79, 203, 205, 0.1) 0%, rgba(59, 179, 181, 0.05) 100%);
    border: 1px solid rgba(79, 203, 205, 0.2);
    border-radius: 12px;
    padding: 16px 24px;
    margin-bottom: 20px;
}

.gift-revealed__info-item[b-trd0ofax8r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.gift-revealed__info-label[b-trd0ofax8r] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #4FCBCD;
}

.gift-revealed__info-value[b-trd0ofax8r] {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-header);
}

.gift-revealed__info-divider[b-trd0ofax8r] {
    width: 1px;
    height: 35px;
    background: linear-gradient(to bottom, transparent, rgba(79, 203, 205, 0.3), transparent);
}

/* Icon Wrapper */
.gift-revealed__icon-wrapper[b-trd0ofax8r] {
    position: relative;
    display: inline-block;
    margin-bottom: 16px;
}

.gift-revealed__icon[b-trd0ofax8r] {
    font-size: 72px;
    display: block;
    animation: bounce-b-trd0ofax8r 2s ease-in-out infinite;
}

.gift-revealed__icon-glow[b-trd0ofax8r] {
    position: absolute;
    inset: -20px;
    background: radial-gradient(circle, rgba(79, 203, 205, 0.3) 0%, transparent 70%);
    animation: pulse-glow 2s ease-in-out infinite;
    pointer-events: none;
}

/* Title */
.gift-revealed__title[b-trd0ofax8r] {
    background: linear-gradient(135deg, #4FCBCD 0%, #7C3AED 50%, #F59E0B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.gift-revealed__subtitle[b-trd0ofax8r] {
    color: var(--color-text);
    font-size: 1.1rem;
    opacity: 0.8;
}

/* Premium Credentials Card */
.gift-revealed__card[b-trd0ofax8r] {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.8) 0%, rgba(15, 23, 42, 0.9) 100%);
    border: 1px solid rgba(79, 203, 205, 0.2);
    border-radius: 20px;
    padding: 0;
    margin-bottom: 24px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* Individual Credential */
.gift-revealed__credential[b-trd0ofax8r] {
    padding: 24px;
    border-bottom: 1px solid rgba(79, 203, 205, 0.1);
}

.gift-revealed__credential:last-child[b-trd0ofax8r] {
    border-bottom: none;
}

.gift-revealed__credential-header[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    color: #4FCBCD;
}

.gift-revealed__credential-label[b-trd0ofax8r] {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.gift-revealed__credential-value[b-trd0ofax8r] {
    font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
    font-size: 1.4rem;
    font-weight: 600;
    color: #E5E7EB;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(79, 203, 205, 0.15);
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 16px;
    word-break: break-all;
    text-align: center;
}

.gift-revealed__copy-btn[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 24px;
    background: linear-gradient(135deg, #4FCBCD 0%, #3BB3B5 100%);
    border: none;
    border-radius: 12px;
    color: #0F172A;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 16px rgba(79, 203, 205, 0.3);
}

.gift-revealed__copy-btn:hover[b-trd0ofax8r] {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(79, 203, 205, 0.4);
}

.gift-revealed__copy-btn:active[b-trd0ofax8r] {
    transform: translateY(0);
}

/* Play Section */
.gift-revealed__play-section[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 24px;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(124, 58, 237, 0.1) 100%);
    border: 1px solid rgba(59, 130, 246, 0.2);
    border-radius: 14px;
    margin-bottom: 16px;
}

.gift-revealed__play-icon[b-trd0ofax8r] {
    font-size: 28px;
}

.gift-revealed__play-text[b-trd0ofax8r] {
    margin: 0;
    color: var(--color-header);
    font-weight: 500;
}

.gift-revealed__play-text a[b-trd0ofax8r] {
    color: #4FCBCD;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
}

.gift-revealed__play-text a:hover[b-trd0ofax8r] {
    border-bottom-color: #4FCBCD;
}

/* Security Warning */
.gift-revealed__warning[b-trd0ofax8r] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 20px;
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 12px;
    margin-bottom: 28px;
    color: #F59E0B;
    font-size: 14px;
    font-weight: 500;
}

/* CTA Button */
.gift-revealed__cta[b-trd0ofax8r] {
    display: inline-block;
    padding: 16px 48px;
    background: linear-gradient(135deg, #FF8749 0%, #FF6B2B 100%);
    color: #FFFFFF;
    font-weight: 700;
    font-size: 16px;
    border-radius: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 6px 20px rgba(255, 107, 43, 0.3);
}

.gift-revealed__cta:hover[b-trd0ofax8r] {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(255, 107, 43, 0.4);
}

@keyframes bounce-b-trd0ofax8r {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}

@keyframes fadeInUp-b-trd0ofax8r {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile */
@media (max-width: 480px) {
    .gift-title[b-trd0ofax8r] {
        font-size: 24px;
    }

    .gift-box[b-trd0ofax8r] {
        width: 160px;
        height: 160px;
    }

    .gift-box__base[b-trd0ofax8r] {
        height: 100px;
    }

    .gift-revealed__card[b-trd0ofax8r] {
        padding: 15px;
    }
}
/* /Pages/Index.razor.rz.scp.css */
/* Hide hero image on mobile to improve performance - prevents image loading */
        @media (max-width: 768px) {
            .mainscreen__picture[b-n8l9ndcs6q] {
                display: none !important;
            }
            
            .mainscreen__picture img[b-n8l9ndcs6q],
            .mainscreen__picture source[b-n8l9ndcs6q] {
                display: none !important;
            }

            .mainscreen__cta[b-n8l9ndcs6q] {
                margin: 0 auto;
                width: 100%;
                text-align: center;
            }
        }
/* /Pages/LolAccounts.razor.rz.scp.css */
/* Premium Hextech Styling for LoL Accounts Page */

/* Base container adjustments */
.info-screen[b-tr8t4salz8] {
    background: transparent !important;
    /* Let theme background show */
    padding-bottom: 60px;
}

/* --- HERO / INTRO SECTION --- */
.page-header.--big[b-tr8t4salz8] {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 30px;
    color: var(--color-header);
    line-height: 1.2;
    text-align: center;
    width: 100%;
}

/* Dark Mode Overrides */
[data-theme="dark"] .page-header[b-tr8t4salz8],
[data-theme="dark"] .page-header.--big[b-tr8t4salz8],
[data-theme="dark"] .feature-card__title[b-tr8t4salz8] {
    color: #ffffff !important;
}

[data-theme="dark"] .be-guide-title[b-tr8t4salz8],
[data-theme="dark"] .warranty-text h3[b-tr8t4salz8] {
    color: #ffffff !important;
}

[data-theme="dark"] .feature-card h4[b-tr8t4salz8] {
    color: #ffffff !important;
}

/* --- FEATURE GRID --- */
.features-grid[b-tr8t4salz8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 40px;
    width: 100%;
    /* Ensure grid itself is centered if max-width applies */
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

.feature-card[b-tr8t4salz8] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 30px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    height: 100%;

    /* Strict Centering Layout */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
}

/* INTRO CARD SPECIAL STYLES (The "Big Box") */
.feature-card--full[b-tr8t4salz8] {
    grid-column: 1 / -1;
    background: var(--bg-secondary);
    /* or a slight gradient */
    padding: 40px;
}

.feature-card--full .feature-card__desc[b-tr8t4salz8] {
    /* Constrain text width for readability - stops the "ugly" wall of text */
    max-width: 800px;
    margin: 0 auto;
    font-size: 1.05rem;
    /* Slightly larger text */
    line-height: 1.8;
}

/* Intro Icons - Centered and Styled */
.intro-icon[b-tr8t4salz8] {
    display: block;
    width: 50px;
    height: 50px;
    object-fit: contain;
    margin: 25px auto 15px auto;
    /* Spacing around icon */
    opacity: 0.8;
    filter: grayscale(80%);
    /* Subtle look */
    transition: all 0.3s;
}

.feature-card--full:hover .intro-icon[b-tr8t4salz8] {
    filter: none;
    opacity: 1;
    transform: scale(1.1);
}

.feature-card--full h4[b-tr8t4salz8] {
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 30px;
    margin-bottom: 15px;
    color: var(--color-header);
    text-align: center;
}

.feature-card:hover[b-tr8t4salz8] {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    border-color: var(--color-primary);
}

/* Hextech overlay effect on hover */
.feature-card[b-tr8t4salz8]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    box-shadow: inset 0 0 20px rgba(10, 200, 185, 0.05);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.feature-card:hover[b-tr8t4salz8]::after {
    opacity: 1;
}

/* Stacked text header for better symmetry */
.feature-card__header[b-tr8t4salz8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
    width: 100%;
}

.feature-card__icon[b-tr8t4salz8] {
    width: 65px;
    height: 65px;
    object-fit: contain;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.2));
    display: block;
    margin: 0 auto;
}

.feature-card__title[b-tr8t4salz8] {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--color-header);
    margin: 0;
    line-height: 1.3;
    text-align: center;
    width: 100%;
}

.feature-card__desc[b-tr8t4salz8],
.feature-card__desc p[b-tr8t4salz8] {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--color-text);
    text-align: center !important;
    /* FORCE CENTER ALIGNMENT per user request */
    margin: 0 auto;
    width: 100%;
    /* Ensure regular cards don't have super narrow text unless needed */
    max-width: 100%;
}

/* --- WARRANTY & GUARANTEE SECTION (Special Highlight) --- */
.warranty-section[b-tr8t4salz8] {
    background: linear-gradient(135deg, rgba(10, 200, 185, 0.1) 0%, rgba(9, 20, 40, 0.05) 100%);
    border: 1px solid rgba(10, 200, 185, 0.3);
    border-radius: 16px;
    padding: 40px;
    margin: 60px auto;
    max-width: 1000px;
    position: relative;
    text-align: center;
}

/* Dark mode specific subtle glow */
[data-theme="dark"] .warranty-section[b-tr8t4salz8] {
    background: linear-gradient(135deg, rgba(10, 200, 185, 0.15) 0%, rgba(9, 20, 40, 0.4) 100%);
    box-shadow: 0 0 30px rgba(10, 200, 185, 0.1);
}

.warranty-content[b-tr8t4salz8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    text-align: left;
    flex-wrap: wrap;
}

/* On mobile, warranty text becomes centered */
@media (max-width: 768px) {
    .warranty-content[b-tr8t4salz8] {
        flex-direction: column;
        text-align: center;
    }
}

.warranty-icon[b-tr8t4salz8] {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    filter: drop-shadow(0 0 15px rgba(10, 200, 185, 0.4));
}

.warranty-text h3[b-tr8t4salz8] {
    color: var(--color-header);
    font-size: 1.5rem;
    margin-bottom: 10px;
    font-weight: 700;
}

.warranty-text p[b-tr8t4salz8] {
    color: var(--color-text);
    font-size: 1.05rem;
    max-width: 600px;
    margin: 0;
}

/* --- KEY BENEFITS / BE GUIDE GRID (Redesigned 2x2 Layout) --- */
.be-guide-list[b-tr8t4salz8] {
    list-style: none;
    padding: 0;
    display: grid;
    /* FORCE 2 columns 2x2 Grid per key feedback */
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-bottom: 0;
    width: 100%;
}

.be-guide-item[b-tr8t4salz8] {
    background: var(--bg-secondary);
    padding: 25px 20px;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

/* Specific styling for the benefits inside the feature card */
.feature-card .be-guide-item[b-tr8t4salz8] {
    background: linear-gradient(135deg, rgba(var(--color-primary-rgb), 0.05) 0%, transparent 100%);
    border: 1px solid var(--color-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.feature-card .be-guide-item:hover[b-tr8t4salz8] {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(var(--color-primary-rgb), 0.15);
}

.be-guide-title[b-tr8t4salz8] {
    font-weight: 800;
    color: var(--color-primary);
    margin-bottom: 10px;
    display: block;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    width: 100%;
}

.be-guide-desc[b-tr8t4salz8] {
    font-size: 0.9rem;
    color: var(--color-text);
    margin: 0 auto;
    line-height: 1.5;
    text-align: center !important;
}

/* --- RESPONSIVE ADJUSTMENTS --- */
@media (max-width: 768px) {
    .page-header.--big[b-tr8t4salz8] {
        font-size: 2rem;
    }

    .features-grid[b-tr8t4salz8] {
        grid-template-columns: 1fr;
        /* Stack on mobile */
    }

    .be-guide-list[b-tr8t4salz8] {
        grid-template-columns: 1fr;
        /* Stack on mobile */
    }
}

/* --- CUSTOM DARK MODE SCROLLBAR --- */
[data-theme='dark'] [b-tr8t4salz8]::-webkit-scrollbar {
    width: 10px;
}

[data-theme='dark'] [b-tr8t4salz8]::-webkit-scrollbar-track {
    background: #0f1115;
}

[data-theme='dark'] [b-tr8t4salz8]::-webkit-scrollbar-thumb {
    background: #2e3440;
    border-radius: 5px;
    border: 2px solid #0f1115;
}

[data-theme='dark'] [b-tr8t4salz8]::-webkit-scrollbar-thumb:hover {
    background: #0CD9D9;
    /* Hextech Cyan Hover */
}
/* /Pages/ReferralDashboard.razor.rz.scp.css */
/* ReferralDashboard.razor.css - Scoped styles for Referral Dashboard */

.referral-dashboard-section[b-u196sufvn4] {
    padding: 40px 0;
}

.referral-dashboard-header[b-u196sufvn4] {
    text-align: center;
    margin-bottom: 40px;
}

.referral-dashboard-icon[b-u196sufvn4] {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    box-shadow: 0 8px 24px rgba(255, 135, 73, 0.25);
}

.referral-dashboard-icon svg[b-u196sufvn4] {
    color: #FFFFFF;
}

.referral-dashboard-title[b-u196sufvn4] {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-header);
    margin: 0 0 12px;
}

.referral-dashboard-subtitle[b-u196sufvn4] {
    font-size: 16px;
    color: var(--color-text);
    margin: 0;
}

.referral-stats-grid[b-u196sufvn4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

.referral-stat-card[b-u196sufvn4] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    gap: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.referral-stat-card:hover[b-u196sufvn4] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.referral-stat-icon[b-u196sufvn4] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.referral-stat-icon svg[b-u196sufvn4] {
    color: #FFFFFF;
}

.referral-stat-content[b-u196sufvn4] {
    flex: 1;
}

.referral-stat-value[b-u196sufvn4] {
    font-size: 28px;
    font-weight: 700;
    color: var(--color-header);
    line-height: 1;
    margin-bottom: 4px;
}

.referral-stat-label[b-u196sufvn4] {
    font-size: 14px;
    color: #666;
}

.referral-link-card[b-u196sufvn4],
.referral-info-card[b-u196sufvn4],
.referral-history-card[b-u196sufvn4] {
    background: #fff;
    border-radius: 12px;
    padding: 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 24px;
}

.referral-link-title[b-u196sufvn4],
.referral-info-title[b-u196sufvn4],
.referral-history-title[b-u196sufvn4] {
    font-size: 24px;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 12px;
}

.referral-link-description[b-u196sufvn4] {
    color: var(--color-text);
    margin-bottom: 24px;
}

.referral-link-input-group[b-u196sufvn4] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.referral-link-input[b-u196sufvn4] {
    flex: 1;
    padding: 12px 16px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
    background: #f9f9f9;
}

.referral-link-copy-btn[b-u196sufvn4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
}

.referral-link-copy-btn:hover[b-u196sufvn4] {
    background: #FF6B2B;
}

.referral-code-display[b-u196sufvn4] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #f9f9f9;
    border-radius: 8px;
}

.referral-code-label[b-u196sufvn4] {
    font-weight: 600;
    color: var(--color-text);
}

.referral-code-value[b-u196sufvn4] {
    font-family: monospace;
    font-size: 18px;
    font-weight: 700;
    color: var(--color-primary);
}

.referral-steps[b-u196sufvn4] {
    display: grid;
    gap: 24px;
    margin-top: 24px;
}

.referral-step[b-u196sufvn4] {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.referral-step-number[b-u196sufvn4] {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}

.referral-step-content h3[b-u196sufvn4] {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 8px;
}

.referral-step-content p[b-u196sufvn4] {
    color: var(--color-text);
    margin: 0;
}

.referral-history-list[b-u196sufvn4] {
    margin-top: 20px;
}

.referral-history-item[b-u196sufvn4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid #e0e0e0;
}

.referral-history-item:last-child[b-u196sufvn4] {
    border-bottom: none;
}

.referral-history-info[b-u196sufvn4] {
    flex: 1;
}

.referral-history-email[b-u196sufvn4] {
    font-weight: 600;
    color: var(--color-header);
    margin-bottom: 4px;
}

.referral-history-date[b-u196sufvn4] {
    font-size: 14px;
    color: #666;
}

.referral-history-amount[b-u196sufvn4] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.referral-history-status[b-u196sufvn4] {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.referral-history-status.success[b-u196sufvn4] {
    background: #d1fae5;
    color: #065f46;
}

.referral-history-status.pending[b-u196sufvn4] {
    background: #fef3c7;
    color: #92400e;
}

.referral-history-reward[b-u196sufvn4] {
    font-weight: 700;
    color: var(--color-primary);
    font-size: 16px;
}

.referral-email-form[b-u196sufvn4] {
    background: #fff;
    border-radius: 12px;
    padding: 40px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    text-align: center;
    max-width: 500px;
    margin: 0 auto;
}

.referral-email-form h2[b-u196sufvn4] {
    font-size: 24px;
    font-weight: 600;
    color: var(--color-header);
    margin: 0 0 8px;
}

.referral-email-form p[b-u196sufvn4] {
    color: var(--color-text);
    margin-bottom: 24px;
}

.referral-email-input[b-u196sufvn4] {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 16px;
}

.referral-submit-btn[b-u196sufvn4] {
    width: 100%;
    padding: 12px 24px;
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
}

.referral-submit-btn:hover[b-u196sufvn4] {
    background: #FF6B2B;
}

.referral-error[b-u196sufvn4] {
    color: #dc2626;
    font-size: 14px;
    margin-bottom: 16px;
    text-align: left;
}

.loading-spinner[b-u196sufvn4] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid var(--color-primary);
    border-radius: 50%;
    animation: spin-b-u196sufvn4 1s linear infinite;
    margin: 0 auto;
}

@keyframes spin-b-u196sufvn4 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@media (max-width: 768px) {
    .referral-stats-grid[b-u196sufvn4] {
        grid-template-columns: 1fr;
    }

    .referral-link-input-group[b-u196sufvn4] {
        flex-direction: column;
    }

    .referral-history-item[b-u196sufvn4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}
/* /Pages/Reviews.razor.rz.scp.css */
/* Reviews.razor.css - Scoped styles for Reviews page */

.review-card-clickable:hover[b-f3vov39l5x] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(12, 217, 217, 0.2) !important;
    border-color: rgba(12, 217, 217, 0.4) !important;
}

.review-card-clickable:active[b-f3vov39l5x] {
    transform: translateY(-2px);
}

.verified-badge-link:hover[b-f3vov39l5x] {
    background: rgba(12, 217, 217, 0.15) !important;
    border-color: rgba(12, 217, 217, 0.5) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(12, 217, 217, 0.15);
}

.verified-badge-link:active[b-f3vov39l5x] {
    transform: translateY(0);
}
/* /Pages/ThankYou.razor.rz.scp.css */
/* Unboxing & Thank You Page Styles matched to Theme */

.unboxing-wrapper[b-jj4ffx2js1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    min-height: 400px;
}

.hidden-initially[b-jj4ffx2js1] {
    opacity: 0;
    visibility: hidden;
    height: 0;
    overflow: hidden;
}

.fade-in-delayed[b-jj4ffx2js1] {
    animation: fadeSlideUp-b-jj4ffx2js1 0.8s ease-out 0.3s forwards;
}

.fade-in-delayed-2[b-jj4ffx2js1] {
    animation: fadeSlideUp-b-jj4ffx2js1 0.8s ease-out 0.5s forwards;
}

.fade-in-delayed-3[b-jj4ffx2js1] {
    animation: fadeSlideUp-b-jj4ffx2js1 0.8s ease-out 0.7s forwards;
}

.loot-card-animation[b-jj4ffx2js1] {
    animation: lootPop-b-jj4ffx2js1 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    transform-origin: center top;
    width: 100%;
}

.reset-unbox-wrapper[b-jj4ffx2js1] {
    margin-top: 10px;
    margin-bottom: 30px;
    text-align: center;
    animation: fadeIn-b-jj4ffx2js1 0.5s ease 1s forwards;
    opacity: 0;
}

.btn-text[b-jj4ffx2js1] {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 0.9rem;
    transition: color 0.2s;
    padding: 8px;
}

.btn-text:hover[b-jj4ffx2js1] {
    color: var(--color-primary);
}

/* --- Chest Styles (Theme Agnostic - Hextech is always Hextech) --- */
/* --- Chest Styles (Image Asset) --- */
.chest-container[b-jj4ffx2js1] {
    width: 200px;
    height: 200px;
    /* Slightly taller for the image aspect ratio */
    position: relative;
    cursor: pointer;
    margin-top: 40px;
    /* Removed perspective as it's now a 2D image */
}

.chest-box[b-jj4ffx2js1] {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    transition: transform 0.2s;
}

.chest-img[b-jj4ffx2js1] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.5));
    transition: filter 0.3s;
}

/* Hover Effect: Scale & Brighten */
.chest-container:hover .chest-box[b-jj4ffx2js1] {
    transform: scale(1.05);
}

.chest-container:hover .chest-img[b-jj4ffx2js1] {
    filter: drop-shadow(0 15px 30px rgba(12, 217, 217, 0.4)) brightness(1.1);
}

/* Opening Animation Sequence */
.chest-box.opening[b-jj4ffx2js1] {
    animation: chestOpenSequence-b-jj4ffx2js1 1.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) forwards;
}

@keyframes chestOpenSequence-b-jj4ffx2js1 {
    0% {
        transform: scale(1) rotate(0deg);
    }

    /* Phase 1: Rapid High-Frequency Shake (0-60%) */
    10% {
        transform: scale(1.02) rotate(-2deg);
    }

    20% {
        transform: scale(1.02) rotate(2deg);
    }

    30% {
        transform: scale(1.05) rotate(-3deg);
    }

    40% {
        transform: scale(1.05) rotate(3deg);
    }

    50% {
        transform: scale(1.08) rotate(-4deg);
        filter: brightness(1.2);
    }

    60% {
        transform: scale(1.08) rotate(4deg);
        filter: brightness(1.3);
    }

    /* Phase 2: Critical Mass & Contraction (60-90%) */
    70% {
        transform: scale(1.15) rotate(-5deg);
        filter: brightness(1.5);
    }

    80% {
        transform: scale(1.15) rotate(5deg);
        filter: brightness(1.8);
    }

    90% {
        transform: scale(0.9) rotate(0deg);
        opacity: 1;
        filter: brightness(2);
    }

    /* Phase 3: EXPLOSION (90-100%) */
    100% {
        transform: scale(3);
        opacity: 0;
        filter: brightness(5);
    }
}

.chest-glow-outer[b-jj4ffx2js1] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(12, 217, 217, 0.3) 0%, transparent 70%);
    z-index: 1;
    opacity: 0.6;
    animation: pulse-glow-b-jj4ffx2js1 3s infinite;
}

.chest-text[b-jj4ffx2js1] {
    position: absolute;
    bottom: -30px;
    left: 0;
    width: 100%;
    color: var(--color-primary);
    font-family: inherit;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-align: center;
    font-size: 0.9rem;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.chest-container.opening .chest-text[b-jj4ffx2js1] {
    opacity: 0;
}

/* --- Special FX --- */
.chest-rays[b-jj4ffx2js1] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 300px;
    height: 300px;
    background: conic-gradient(from 0deg, transparent 0deg, rgba(12, 217, 217, 0.2) 20deg, transparent 40deg, rgba(8, 145, 178, 0.2) 60deg, transparent 80deg);
    border-radius: 50%;
    z-index: 0;
    opacity: 0;
    transition: opacity 0.5s;
    pointer-events: none;
}

.chest-container:hover .chest-rays[b-jj4ffx2js1] {
    opacity: 1;
    animation: spin-b-jj4ffx2js1 10s linear infinite;
}

.white-flash[b-jj4ffx2js1] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: white;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.1s;
}

.white-flash.active[b-jj4ffx2js1] {
    opacity: 0.5;
    animation: flashDismiss-b-jj4ffx2js1 1s forwards;
}

@keyframes spin-b-jj4ffx2js1 {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes flashDismiss-b-jj4ffx2js1 {
    0% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
    }
}

/* --- Animations --- */
.shaking[b-jj4ffx2js1] {
    animation: shake-b-jj4ffx2js1 0.5s cubic-bezier(.36, .07, .19, .97) both infinite;
}

@keyframes shake-b-jj4ffx2js1 {

    10%,
    90% {
        transform: translate3d(-1px, 0, 0) rotate(1deg);
    }

    20%,
    80% {
        transform: translate3d(2px, 0, 0) rotate(-1deg);
    }

    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0) rotate(2deg);
    }

    40%,
    60% {
        transform: translate3d(4px, 0, 0) rotate(-2deg);
    }
}

@keyframes pulse-b-jj4ffx2js1 {
    0% {
        transform: translate(-50%, 0) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translate(-50%, 0) scale(1.2);
        opacity: 1;
        box-shadow: 0 0 20px #fff;
    }

    100% {
        transform: translate(-50%, 0) scale(1);
        opacity: 0.8;
    }
}

@keyframes pulse-glow-b-jj4ffx2js1 {
    0% {
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1);
    }

    50% {
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(1.1);
    }

    100% {
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes lootPop-b-jj4ffx2js1 {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes fadeSlideUp-b-jj4ffx2js1 {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn-b-jj4ffx2js1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Points Earned Banner */
.points-earned-banner[b-jj4ffx2js1] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    padding: 16px 20px;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.12), rgba(255, 165, 0, 0.06));
    border: 1px solid rgba(255, 215, 0, 0.3);
    border-radius: 12px;
    animation: fadeSlideUp-b-jj4ffx2js1 0.6s ease-out 0.6s forwards;
    opacity: 0;
}

.points-earned-icon[b-jj4ffx2js1] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.2), rgba(255, 165, 0, 0.15));
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.points-earned-text[b-jj4ffx2js1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.points-earned-label[b-jj4ffx2js1] {
    font-size: 12px;
    color: var(--color-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.points-earned-value[b-jj4ffx2js1] {
    font-size: 18px;
    font-weight: 700;
    color: #FFD700;
}

.points-earned-link[b-jj4ffx2js1] {
    flex-shrink: 0;
    padding: 8px 16px;
    background: linear-gradient(135deg, #FFD700, #FFA500);
    border-radius: 8px;
    color: #000;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.points-earned-link:hover[b-jj4ffx2js1] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.35);
}

@media (max-width: 500px) {
    .points-earned-banner[b-jj4ffx2js1] {
        flex-wrap: wrap;
    }

    .points-earned-link[b-jj4ffx2js1] {
        width: 100%;
        text-align: center;
        margin-top: 8px;
    }
}

/* Light mode adjustments */
[data-theme="light"] .points-earned-banner[b-jj4ffx2js1] {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.15), rgba(255, 165, 0, 0.1));
    border-color: rgba(255, 165, 0, 0.4);
}

[data-theme="light"] .points-earned-value[b-jj4ffx2js1] {
    color: #D97706;
    /* Darker gold for light mode */
}

[data-theme="light"] .points-earned-icon[b-jj4ffx2js1] {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.25), rgba(255, 165, 0, 0.2));
}
/* /Pages/TrackOrder.razor.rz.scp.css */
/* TrackOrder.razor.css - Scoped styles for Track Order page */

.track-order-section[b-rw75em4lxy] {
    min-height: 70vh;
    background: var(--bg-primary);
}

.track-order-header[b-rw75em4lxy] {
    text-align: center;
    margin-bottom: 32px;
}

.track-order-icon[b-rw75em4lxy] {
    font-size: 48px;
    margin-bottom: 16px;
}

.track-order-form[b-rw75em4lxy] {
    margin-bottom: 24px;
}

.track-order-input-group[b-rw75em4lxy] {
    display: flex;
    gap: 12px;
}

.track-order-input[b-rw75em4lxy] {
    flex: 1;
    padding: 14px 16px;
    font-size: 15px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.track-order-input:focus[b-rw75em4lxy] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(255, 135, 73, 0.15);
}

.track-order-btn[b-rw75em4lxy] {
    white-space: nowrap;
    padding: 14px 24px;
}

.track-order-error[b-rw75em4lxy] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 12px 16px;
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 8px;
    color: #ef4444;
    font-size: 14px;
}

.track-order-success[b-rw75em4lxy] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    padding: 12px 16px;
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.3);
    border-radius: 8px;
    color: var(--color-success);
    font-size: 14px;
}

.btn-with-icon[b-rw75em4lxy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.track-order-result[b-rw75em4lxy] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
}

.track-order-result-header[b-rw75em4lxy] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-light);
}

.track-order-result-icon[b-rw75em4lxy] {
    font-size: 28px;
}

.track-order-result-header h2[b-rw75em4lxy] {
    margin: 0;
    font-size: 20px;
    color: var(--text-secondary);
}

.track-order-details[b-rw75em4lxy] {
    margin-bottom: 20px;
}

.track-order-detail-row[b-rw75em4lxy] {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-light);
}

.track-order-detail-row:last-child[b-rw75em4lxy] {
    border-bottom: none;
}

.track-order-detail-label[b-rw75em4lxy] {
    color: var(--text-muted);
    font-size: 14px;
}

.track-order-detail-value[b-rw75em4lxy] {
    color: var(--text-secondary);
    font-weight: 500;
    font-size: 14px;
    text-align: right;
}

.track-order-detail-value--mono[b-rw75em4lxy] {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 13px;
}

.track-order-detail-value--success[b-rw75em4lxy] {
    color: #22c55e;
}

.track-order-actions[b-rw75em4lxy] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.track-order-action-btn[b-rw75em4lxy] {
    flex: 1;
    min-width: 140px;
    text-align: center;
    padding: 12px 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Light Mode Button Overrides - using ::deep for child elements */
[b-rw75em4lxy] [data-theme="light"] .track-order-action-btn.--secondary {
    background-color: #2F3238 !important;
    color: #FFFFFF !important;
}

[b-rw75em4lxy] [data-theme="light"] .track-order-action-btn.--outline {
    border-color: #2F3238 !important;
    color: #2F3238 !important;
}

[b-rw75em4lxy] [data-theme="light"] .track-order-action-btn.--secondary:hover {
    background-color: #1a1d21 !important;
}

[b-rw75em4lxy] [data-theme="light"] .track-order-action-btn.--outline:hover {
    background-color: rgba(47, 50, 56, 0.05) !important;
}

.track-order-help[b-rw75em4lxy] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 20px;
}

.track-order-help h3[b-rw75em4lxy] {
    margin: 0 0 12px 0;
    font-size: 16px;
    color: var(--text-secondary);
}

.track-order-help p[b-rw75em4lxy] {
    margin: 0 0 8px 0;
    font-size: 14px;
    color: var(--text-primary);
    line-height: 1.6;
}

.track-order-help p:last-child[b-rw75em4lxy] {
    margin-bottom: 0;
}

.track-order-help code[b-rw75em4lxy] {
    background: var(--bg-tertiary);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 13px;
    color: var(--color-primary);
}

.track-order-help a[b-rw75em4lxy] {
    color: var(--color-primary);
    text-decoration: none;
}

.track-order-help a:hover[b-rw75em4lxy] {
    text-decoration: underline;
}

/* Mobile */
@media (max-width: 600px) {
    .track-order-input-group[b-rw75em4lxy] {
        flex-direction: column;
    }

    .track-order-btn[b-rw75em4lxy] {
        width: 100%;
    }

    .track-order-actions[b-rw75em4lxy] {
        flex-direction: column;
    }

    .track-order-action-btn[b-rw75em4lxy] {
        width: 100%;
    }
}
/* /Shared/AccountSectionComponent.razor.rz.scp.css */
/* AccountSectionComponent.razor.css - Scoped styles for Account Section */

/* =========================================
   VERTICAL RHYTHM & LAYOUT
   ========================================= */
.account-container__step[b-dy3c5y86mp] {
    margin-bottom: 24px;
    /* Reduced to fix large gap */
    position: relative;
}

.account-container__step:last-child[b-dy3c5y86mp] {
    margin-bottom: 0;
}

.account-container__header[b-dy3c5y86mp] {
    margin-bottom: 12px;
    /* Tighter heading spacing */
    line-height: 1.2;
}

/* Vertically center checkout button with info boxes */
.account-review__footer[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.account-review__col.--footer-left[b-dy3c5y86mp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.account-review__col.--footer-right[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    min-width: 200px;
}

/* Active State for Account Box - Restoring Border */
/* Active State for Account Box - Unify with Region Buttons */
.account-row__item.--active[b-dy3c5y86mp] {
    border: 1px solid #0cd9d9 !important;
    /* Cyan border match */
    background-color: rgba(12, 217, 217, 0.05);
    transform: translateY(-2px);
    box-shadow: 0 0 15px rgba(12, 217, 217, 0.2);
    /* Smooth Pop Animation */
    animation: pop-in-b-dy3c5y86mp 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

[data-theme="dark"] .account-row__item.--active[b-dy3c5y86mp] {
    background-color: rgba(34, 234, 234, 0.1);
    box-shadow: 0 0 20px rgba(34, 234, 234, 0.15);
}

@keyframes pop-in-b-dy3c5y86mp {
    0% {
        transform: scale(0.95) translateY(0);
    }

    100% {
        transform: scale(1) translateY(-2px);
    }
}

/* "Live" Urgency Badge - Blinking Dot */
.account-stock[b-dy3c5y86mp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.account-stock[b-dy3c5y86mp]::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: #ef4444;
    /* Red for urgency */
    border-radius: 50%;
    box-shadow: 0 0 8px #ef4444;
    animation: blink-urgent-b-dy3c5y86mp 1.5s infinite;
}

@keyframes blink-urgent-b-dy3c5y86mp {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.4;
        transform: scale(0.8);
    }
}

/* Ensure JS-injected glare doesn't break layout */
.tilt-glare[b-dy3c5y86mp] {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
    border-radius: 16px;
    /* Glare itself handles its own background/opacity transitions via JS or CSS if custom.js doesn't */
}

[data-theme="dark"] .account-row__item:hover[b-dy3c5y86mp] {
    background: rgba(35, 35, 40, 0.8) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    transform: translateY(-2px);
    /* Interaction note: JS 'tilt' overwrites transform on mousemove. 
       This hover transform works only until mousemove starts. */
    box-shadow: 0 8px 32px -4px rgba(0, 0, 0, 0.3);
}

/* Region Selector Grid - Horizontal Layout */
.region-selector[b-dy3c5y86mp] {
    display: flex;
    /* Force row */
    flex-wrap: wrap;
    /* Allow wrapping */
    gap: 16px;
    margin-bottom: 0;
    /* Remove double margin */
    background: none !important;
    /* NUKE THE GREY BOX */
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Safe Alignment Fix for Desktop */
.account-row__item[b-dy3c5y86mp] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100%;
}








/* Premium Hextech Region Card */
.region-btn[b-dy3c5y86mp] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 24px;
    border: 1px solid #cbd5e1;
    /* Visible slate border for Light Mode */
    border-radius: 12px;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 180px;
}

[data-theme="dark"] .region-btn[b-dy3c5y86mp] {
    border-color: rgba(255, 255, 255, 0.1);
    /* Subtle white border for Dark Mode */
}

/* Hover Effect */
/* Hover Effect */
.region-btn:hover[b-dy3c5y86mp] {
    transform: translateY(-2px);
    background: #f1f5f9;
    /* Light grey hover for Light Mode */
    border-color: #94a3b8;
}

[data-theme="dark"] .region-btn:hover[b-dy3c5y86mp] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.3);
}

/* Active State - "Powered Up" */
/* Active State - "Powered Up" */
.region-btn.--active[b-dy3c5y86mp],
[data-theme="dark"] .region-btn.--active[b-dy3c5y86mp] {
    border: 2px solid #0cd9d9 !important;
    background: rgba(12, 217, 217, 0.15) !important;
    box-shadow: 0 0 20px rgba(12, 217, 217, 0.4) !important;
    outline: none !important;
}

/* The Flag/Icon Container */
.region-btn__flag[b-dy3c5y86mp] {
    font-size: 2rem;
    line-height: 1;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
    display: flex;
    /* Fix alignment */
    transition: transform 0.3s ease;
}

.region-btn:hover .region-btn__flag[b-dy3c5y86mp] {
    transform: scale(1.1) rotate(-5deg);
}

.region-btn.--active .region-btn__flag[b-dy3c5y86mp] {
    transform: scale(1.1);
    filter: drop-shadow(0 0 8px rgba(12, 217, 217, 0.6));
}

/* Text Container */
.region-btn__info[b-dy3c5y86mp] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* Force Left Align */
    justify-content: center;
    text-align: left;
    /* Ensure text aligns left */
}

/* Region Code (OCE, NA) */
/* Region Code (OCE, NA) */
.region-btn__code[b-dy3c5y86mp] {
    font-size: 1.1rem;
    font-weight: 800;
    color: #1e293b;
    /* Dark text for Light Mode */
    line-height: 1;
    letter-spacing: 1px;
}

[data-theme="dark"] .region-btn__code[b-dy3c5y86mp] {
    color: #fff;
}

.region-btn.--active .region-btn__code[b-dy3c5y86mp] {
    color: #0891b2;
    /* Cyan-dark for Light Mode Active */
    text-shadow: none;
}

[data-theme="dark"] .region-btn.--active .region-btn__code[b-dy3c5y86mp] {
    color: #0cd9d9;
    text-shadow: 0 0 10px rgba(12, 217, 217, 0.5);
}

/* Full Region Name */
.region-btn__name[b-dy3c5y86mp] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    /* Slate-500 for Light Mode */
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}

[data-theme="dark"] .region-btn__name[b-dy3c5y86mp] {
    color: rgba(255, 255, 255, 0.6);
}

.region-btn.--active .region-btn__name[b-dy3c5y86mp] {
    color: #0f172a;
    /* Darker for active light mode */
}

[data-theme="dark"] .region-btn.--active .region-btn__name[b-dy3c5y86mp] {
    color: rgba(255, 255, 255, 0.9);
}

/* Shine Animation for Active State */
/* Shine Animation for Active State - REMOVED */
.region-btn.--active[b-dy3c5y86mp]::after {
    content: none;
    display: none;
}

@keyframes shine-move-b-dy3c5y86mp {
    0% {
        left: -100%;
    }

    20% {
        left: 200%;
    }

    100% {
        left: 200%;
    }
}

/* ----------------------------------------------------------- */

/* Enhanced Active Card State */
[data-theme="dark"] .account-row__item.--active[b-dy3c5y86mp] {
    background: radial-gradient(circle at center, rgba(12, 217, 217, 0.08), rgba(12, 217, 217, 0.02)) !important;
    border: 2px solid var(--color-secondary) !important;
    box-shadow: 0 0 25px rgba(12, 217, 217, 0.25), inset 0 0 10px rgba(12, 217, 217, 0.1) !important;
    z-index: 2;
}

/* Only apply transform on desktop - prevents card size increase on mobile */
@media (min-width: 769px) {
    [data-theme="dark"] .account-row__item.--active[b-dy3c5y86mp] {
        transform: translateY(-4px) scale(1.02);
    }
}

/* Typography Enhancements inside Glass Cards */
[data-theme="dark"] .account-row__be[b-dy3c5y86mp] {
    /* Name */
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .account-row__caption[b-dy3c5y86mp] {
    /* Meta labels */
    color: #94A3B8 !important;
}

[data-theme="dark"] .account-row__price[b-dy3c5y86mp] {
    color: #fff !important;
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 2. Neon Stock Indicators */
.stock-visualizer__bar[b-dy3c5y86mp] {
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 4px;
    height: 6px !important;
    overflow: hidden;
}

.stock-visualizer__fill[b-dy3c5y86mp] {
    background: linear-gradient(90deg, #ff8749, #ff5d2b) !important;
    box-shadow: 0 0 8px rgba(255, 93, 43, 0.6);
    border-radius: 4px;
}

.stock-visualizer__text[b-dy3c5y86mp] {
    color: #ff8749 !important;
    font-weight: 600 !important;
    text-shadow: 0 0 10px rgba(255, 135, 73, 0.3);
}

/* 3. Cinematic Review Panel (Step 3) */
.account-review[b-dy3c5y86mp] {
    background: #FFFFFF;
    border: 1px solid var(--border-light);
    border-radius: 8px;
    padding: 0 !important;
    box-shadow: 0 6px 24px 0 rgba(120, 141, 162, 0.13);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[data-theme="dark"] .account-review[b-dy3c5y86mp] {
    background: rgba(23, 23, 23, 0.4) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 20px;
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.5);
}



.account-review__row[b-dy3c5y86mp] {
    padding: 30px;
    display: flex;
    flex-flow: row wrap;
    border-bottom: 1px solid var(--border-light);
}

[data-theme="dark"] .account-review__row[b-dy3c5y86mp] {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.account-review__col[b-dy3c5y86mp] {
    width: 33.333%;
    padding: 10px 0;
}

.account-review__footer[b-dy3c5y86mp] {
    border-top: none !important;
    margin-top: 0 !important;
    padding: 30px !important;
    background: #F8FAFC;
    /* Clean light gray for light mode */
    display: flex;
    align-items: center;
    gap: 20px;
}

[data-theme="dark"] .account-review__footer[b-dy3c5y86mp] {
    background: rgba(0, 0, 0, 0.2);
}

.account-review__caption[b-dy3c5y86mp] {
    color: #64748B !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    font-weight: 600;
    display: block;
    margin-bottom: 4px;
}

[data-theme="dark"] .account-review__caption[b-dy3c5y86mp] {
    color: #64748B !important;
}

.account-review__value[b-dy3c5y86mp] {
    color: #1E293B !important;
    font-size: 1.1rem;
    font-weight: 600;
}

[data-theme="dark"] .account-review__value[b-dy3c5y86mp] {
    color: #fff !important;
}

[data-theme="dark"] .account-review__value.--blue[b-dy3c5y86mp] {
    color: var(--color-secondary) !important;
    text-shadow: 0 0 15px rgba(12, 217, 217, 0.4);
}

@media (min-width: 481px) and (max-width: 1024px) {
    .account-row__left[b-dy3c5y86mp] {
        display: flex !important;
        flex-direction: column !important;
        flex-flow: column nowrap !important;
        align-items: flex-start !important;
        overflow: visible !important;
    }

    .account-row__box[b-dy3c5y86mp] {
        display: flex !important;
        flex-direction: row !important;
        flex-flow: row nowrap !important;
        flex-wrap: nowrap !important;
        width: auto !important;
        max-width: none !important;
        flex-grow: 0 !important;
        flex-shrink: 0 !important;
        overflow: visible !important;
    }

    .account-row__be[b-dy3c5y86mp],
    .account-row__badge[b-dy3c5y86mp] {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    .account-row__be[b-dy3c5y86mp] {
        max-width: none !important;
    }
}

@media (max-width: 480px) {
    .account-row__left[b-dy3c5y86mp] {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 3px !important;
    }

    .account-row__box[b-dy3c5y86mp] {
        flex-wrap: nowrap !important;
        margin: 0 !important;
        width: auto !important;
        max-width: none !important;
        display: flex !important;
        flex-direction: row !important;
        flex-flow: row nowrap !important;
        flex-wrap: nowrap !important;
    }

    .account-row__be[b-dy3c5y86mp],
    .account-row__badge[b-dy3c5y86mp] {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    .account-row__caption[b-dy3c5y86mp] {
        display: block !important;
    }
}

/* Laptop/Notebook Fix (15" screens) */
@media (min-width: 1025px) and (max-width: 1600px) {

    /* Allow cards to be wider - min 280px each */
    .account-row__item[b-dy3c5y86mp] {
        padding: 20px 18px !important;
        min-width: 260px !important;
        max-width: 420px !important;
        /* Prevent single card from spanning full width */
        flex: 1 1 260px !important;
    }

    /* INLINE FIX: Prevent wrapping of Name/Badge */
    .account-row__box[b-dy3c5y86mp] {
        flex-wrap: nowrap !important;
        gap: 8px !important;
        align-items: center !important;
    }

    /* INLINE FIX: Align Caption and Stock on one line */
    .account-row__meta[b-dy3c5y86mp] {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 8px !important;
        margin-top: 6px !important;
    }

    .account-row__caption[b-dy3c5y86mp] {
        font-size: 0.9rem !important;
        white-space: nowrap !important;
    }

    .stock-visualizer[b-dy3c5y86mp],
    .stock-indicator[b-dy3c5y86mp] {
        margin-top: 0 !important;
        flex-shrink: 0 !important;
    }

    /* Restore larger font for Name */
    .account-row__be[b-dy3c5y86mp] {
        font-size: 1.15rem !important;
        white-space: nowrap !important;
    }

    .account-row__badge[b-dy3c5y86mp] {
        font-size: 0.7rem !important;
        padding: 3px 7px !important;
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    /* Price adjustment */
    .account-row__price[b-dy3c5y86mp] {
        font-size: 1.3rem !important;
    }

    .account-row__oldprice[b-dy3c5y86mp] {
        font-size: 0.95rem !important;
    }

    /* Ensure proper layout */
    .account-row__left[b-dy3c5y86mp] {
        width: 100%;
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
    }
}

@media (max-width: 480px) {

    /* MOBILE FIX: Stack quantity selector */
    .quantity-inline[b-dy3c5y86mp] {
        flex-direction: column !important;
        gap: 12px !important;
        height: auto !important;
        padding: 16px !important;
    }

    .quantity-inline__left[b-dy3c5y86mp] {
        width: 100% !important;
        text-align: center !important;
        margin-bottom: 8px !important;
        padding-right: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding-bottom: 12px !important;
    }

    .quantity-inline__options[b-dy3c5y86mp] {
        width: 100% !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    .quantity-inline__btn[b-dy3c5y86mp] {
        flex: 1 !important;
        height: 44px !important;
        /* Larger touch target */
    }

    .quantity-inline__total[b-dy3c5y86mp] {
        width: 100% !important;
        justify-content: center !important;
        margin-top: 8px !important;
        padding-left: 0 !important;
        border-left: none !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding-top: 12px !important;
    }

    /* Tighter cards for mobile */
    .account-row__item[b-dy3c5y86mp] {
        padding: 16px !important;
        margin-bottom: 12px !important;
    }

    /* MOBILE FIX: Disable dark mode active card size increase */
    [data-theme="dark"] .account-row__item.--active[b-dy3c5y86mp] {
        transform: none !important;
        animation: none !important;
    }

    [data-theme="dark"] .account-row__item.--active .account-row__price[b-dy3c5y86mp] {
        font-size: 1rem !important;
    }

    /* INLINE FIX: Force Name/Badge to stay on one line */
    .account-row__box[b-dy3c5y86mp] {
        flex-wrap: nowrap !important;
        gap: 6px !important;
        justify-content: flex-start !important;
        align-items: center !important;
    }

    .account-row__be[b-dy3c5y86mp] {
        font-size: 1.05rem !important;
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .account-row__badge[b-dy3c5y86mp] {
        font-size: 0.65rem !important;
        padding: 2px 6px !important;
        flex-shrink: 0 !important;
    }

    /* INLINE FIX: Force meta info to stay on one line */
    .account-row__meta[b-dy3c5y86mp] {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        margin-top: 4px !important;
        width: 100% !important;
    }

    .account-row__caption[b-dy3c5y86mp] {
        font-size: 0.8rem !important;
        margin-right: 8px !important;
        white-space: nowrap !important;
        margin-bottom: 0 !important;
    }

    .stock-visualizer[b-dy3c5y86mp] {
        margin-top: 0 !important;
        flex: 1 !important;
        justify-content: flex-end !important;
        max-width: 50% !important;
    }

    .stock-visualizer__text[b-dy3c5y86mp] {
        font-size: 0.7rem !important;
        white-space: nowrap !important;
    }
}

/* HIGH IMPACT CHECKOUT BUTTON */
.button.--checkout-action[b-dy3c5y86mp] {
    background: linear-gradient(45deg, #635bff, #a259ff, #635bff);
    background-size: 200% auto;
    color: #FFFFFF;
    /* 1. 3D raised effect - dark purple bottom border */
    border: none;
    border-bottom: 6px solid #3d33a8;
    height: 54px;
    font-size: 19px;
    font-weight: 700;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* 2. Not full width - 85% centered */
    width: 85%;
    margin: 0 auto;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    text-transform: none;
    letter-spacing: 0;
    /* 3. Always-on glow for instant "clickable" signal */
    box-shadow:
        0 6px 25px rgba(99, 91, 255, 0.5),
        0 0 0 1px rgba(255, 255, 255, 0.1) inset;
    animation: stripe-gradient-move-b-dy3c5y86mp 3s linear infinite;
}

.button.--checkout-action[b-dy3c5y86mp]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
    transform: skewX(-15deg);
    animation: stripe-shine-b-dy3c5y86mp 3s infinite;
}

.button.--checkout-action:hover[b-dy3c5y86mp] {
    transform: translateY(-3px);
    border-bottom-width: 6px;
    box-shadow:
        0 12px 35px rgba(99, 91, 255, 0.6),
        0 0 0 2px rgba(255, 255, 255, 0.2) inset;
    filter: brightness(1.1);
}

.button.--checkout-action:hover .checkout-arrow[b-dy3c5y86mp] {
    transform: translateX(6px);
}

.button.--checkout-action:active[b-dy3c5y86mp] {
    transform: translateY(1px);
    border-bottom-width: 2px;
    box-shadow: 0 4px 15px rgba(99, 91, 255, 0.4);
}

/* Checkout button layout & animation */
.button.--checkout-action[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.checkout-text[b-dy3c5y86mp] {
    font-weight: 700;
    letter-spacing: 1px;
    margin-right: 8px;
    transition: transform 0.3s ease;
}

/* The static arrow next to text */
.checkout-arrow[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    transform: translateX(0);
    opacity: 1;
}

/* The arrow that appears at the far right edge */
.checkout-arrow-edge[b-dy3c5y86mp] {
    position: absolute;
    right: 20px;
    display: flex;
    align-items: center;
    opacity: 0;
    transform: translateX(-20px);
    transition: all 0.3s ease;
}

/* SVG styling */
.checkout-arrow svg[b-dy3c5y86mp],
.checkout-arrow-edge svg[b-dy3c5y86mp] {
    display: block;
    width: 24px;
    height: 24px;
}

/* Hover State */
.button.--checkout-action:hover .checkout-text[b-dy3c5y86mp] {
    transform: translateX(-10px);
    /* Move text slightly left */
}

.button.--checkout-action:hover .checkout-arrow[b-dy3c5y86mp] {
    transform: translateX(30px);
    /* Slide center arrow right */
    opacity: 0;
    /* Fade it out */
}

.button.--checkout-action:hover .checkout-arrow-edge[b-dy3c5y86mp] {
    opacity: 1;
    transform: translateX(0);
    /* Slide edge arrow into place */
}

@keyframes stripe-gradient-move-b-dy3c5y86mp {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes stripe-shine-b-dy3c5y86mp {
    0% {
        left: -100%;
    }

    20% {
        left: 200%;
    }

    100% {
        left: 200%;
    }
}

/* ════════════════════════════════════════════════════════════════════════════
   UX/CONVERSION IMPROVEMENTS
   ════════════════════════════════════════════════════════════════════════════ */

/* 1. Best Value Badge - Make one product stand out */
.account-row__badge.--BestValue[b-dy3c5y86mp],
.account-row__badge.--Popular[b-dy3c5y86mp] {
    background: linear-gradient(135deg, #00d4aa 0%, #00b894 100%) !important;
    color: #fff !important;
    animation: best-value-pulse-b-dy3c5y86mp 2s ease-in-out infinite;
    box-shadow: 0 0 15px rgba(0, 212, 170, 0.4);
}

@keyframes best-value-pulse-b-dy3c5y86mp {

    0%,
    100% {
        box-shadow: 0 0 10px rgba(0, 212, 170, 0.3);
    }

    50% {
        box-shadow: 0 0 20px rgba(0, 212, 170, 0.6);
    }
}

/* 2. Enhanced Old Price - More visible strikethrough */
.account-row__oldprice[b-dy3c5y86mp] {
    position: relative;
    opacity: 0.7;
}

[data-theme="dark"] .account-row__oldprice[b-dy3c5y86mp] {
    color: #888 !important;
}

.account-row__oldprice[b-dy3c5y86mp]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 2px;
    background: #ff6b6b;
    transform: rotate(-5deg);
}

/* 3. Savings Badge - Show how much they save */
.quantity-inline__save[b-dy3c5y86mp] {
    background: rgba(0, 212, 170, 0.15) !important;
    border: 1px solid rgba(0, 212, 170, 0.3) !important;
    color: #00d4aa !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    font-size: 0.85rem !important;
    animation: savings-glow-b-dy3c5y86mp 2s ease-in-out infinite;
}

@keyframes savings-glow-b-dy3c5y86mp {

    0%,
    100% {
        box-shadow: 0 0 5px rgba(0, 212, 170, 0.2);
    }

    50% {
        box-shadow: 0 0 15px rgba(0, 212, 170, 0.4);
    }
}

/* 4. Trust Icons near Checkout - muted to not compete with CTA */
.checkout-trust-row[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 12px;
    padding: 8px 0;
    opacity: 0.7;
}

.checkout-trust-item[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.7rem;
    color: #64748B;
    font-weight: 500;
}

[data-theme="dark"] .checkout-trust-item[b-dy3c5y86mp] {
    color: #6b7a8a;
}

.checkout-trust-item svg[b-dy3c5y86mp] {
    width: 14px;
    height: 14px;
    color: var(--color-secondary);
    opacity: 0.8;
}

/* 5. Enhanced CTA with urgency text option */
.button.--checkout-action[b-dy3c5y86mp] {
    position: relative;
}

.button.--checkout-action .cta-urgency[b-dy3c5y86mp] {
    position: absolute;
    top: -10px;
    right: -10px;
    background: #ff6b6b;
    color: #fff;
    font-size: 0.65rem;
    padding: 3px 8px;
    border-radius: 10px;
    font-weight: 700;
    animation: urgency-bounce-b-dy3c5y86mp 1s ease-in-out infinite;
}

@keyframes urgency-bounce-b-dy3c5y86mp {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }
}

/* 6. Improved card hover feedback */
[data-theme="dark"] .account-row__item:hover .account-row__price[b-dy3c5y86mp] {
    color: var(--color-secondary) !important;
    text-shadow: 0 0 20px rgba(12, 217, 217, 0.5);
}

/* 7. Visual hierarchy - Make selected product price pop (desktop only) */
[data-theme="dark"] .account-row__item.--active .account-row__price[b-dy3c5y86mp] {
    color: #fff !important;
    text-shadow: 0 0 25px rgba(255, 255, 255, 0.3);
}

/* Only increase font size on desktop - prevents text cutoff on mobile */
@media (min-width: 769px) {
    [data-theme="dark"] .account-row__item.--active .account-row__price[b-dy3c5y86mp] {
        font-size: 1.6rem !important;
    }
}

/* 8. Subtle animation on stock warning */
.stock-visualizer[b-dy3c5y86mp] {
    animation: stock-attention-b-dy3c5y86mp 3s ease-in-out infinite;
}

@keyframes stock-attention-b-dy3c5y86mp {

    0%,
    90%,
    100% {
        opacity: 1;
    }

    95% {
        opacity: 0.7;
    }
}

/* 9. Review panel value highlights */
.account-review__value.--highlight[b-dy3c5y86mp] {
    color: var(--color-secondary) !important;
    font-weight: 700;
}

/* 10. Mobile checkout improvements */
@media (max-width: 480px) {
    .button.--checkout-action[b-dy3c5y86mp] {
        height: auto !important;
        min-height: 50px !important;
        font-size: 14px !important;
        border-radius: 12px !important;
        width: 100% !important;
        padding: 12px 16px !important;
    }

    .checkout-text[b-dy3c5y86mp] {
        white-space: nowrap !important;
        font-size: 14px !important;
    }

    .checkout-arrow[b-dy3c5y86mp],
    .checkout-arrow-edge[b-dy3c5y86mp] {
        display: none !important;
    }

    .checkout-trust-row[b-dy3c5y86mp] {
        flex-wrap: wrap;
        gap: 10px 15px;
    }
}

/* =========================================
   GOD TIER UPGRADES - SCAN & RIBBON
   ========================================= */

/* 1. Scanning Effect for Account Cards */
/* Only scan the SELECTED card, and only ONCE */
.account-row__item.--active[b-dy3c5y86mp]::after {
    content: '';
    position: absolute;
    top: -100%;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to bottom, transparent, rgba(12, 217, 217, 0.4), transparent);
    animation: scan-effect-b-dy3c5y86mp 2s ease-in-out forwards;
    /* Run once, faster */
    pointer-events: none;
    z-index: 2;
    opacity: 0.6;
}

/* Ensure non-active cards don't have the scanner element */
.account-row__item:not(.--active)[b-dy3c5y86mp]::after {
    content: none;
    display: none;
}

@keyframes scan-effect-b-dy3c5y86mp {
    0% {
        top: -50%;
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    80% {
        opacity: 1;
    }

    100% {
        top: 150%;
        opacity: 0;
    }
}

/* 2. Gold "Best Value" Discount Badge */
.quantity-inline__discount[b-dy3c5y86mp] {
    background: linear-gradient(135deg, #FFD700 0%, #FDB931 100%) !important;
    color: #1a1a1a !important;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4) !important;
    text-shadow: none !important;
    padding: 2px 8px;
    border-radius: 6px;
    animation: shimmer-gold-b-dy3c5y86mp 3s infinite linear;
    background-size: 200% auto;
    position: relative;
    top: -1px;
}

@keyframes shimmer-gold-b-dy3c5y86mp {
    to {
        background-position: 200% center;
    }
}

/* Integrated Wishlist Tool CTA */
.wishlist-inline-cta[b-dy3c5y86mp] {
    margin-top: 24px;
    background: linear-gradient(90deg, rgba(16, 20, 24, 0.4) 0%, rgba(12, 217, 217, 0.05) 100%);
    border: 1px solid rgba(12, 217, 217, 0.2);
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.3s ease;
}

[data-theme="dark"] .wishlist-inline-cta[b-dy3c5y86mp] {
    background: linear-gradient(90deg, rgba(16, 20, 24, 0.6) 0%, rgba(12, 217, 217, 0.08) 100%);
}

.wishlist-inline-cta:hover[b-dy3c5y86mp] {
    border-color: rgba(12, 217, 217, 0.4);
    background: rgba(16, 20, 24, 0.6);
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.wishlist-inline-content[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.wishlist-inline-icon[b-dy3c5y86mp] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
}

.wishlist-inline-text h4[b-dy3c5y86mp] {
    margin: 0;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
}

[data-theme="light"] .wishlist-inline-text h4[b-dy3c5y86mp] {
    color: #1a1a1a;
}

.wishlist-inline-text p[b-dy3c5y86mp] {
    margin: 2px 0 0;
    color: #94A3B8;
    font-size: 0.85rem;
    line-height: 1.4;
}

.wishlist-inline-btn[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(12, 217, 217, 0.1);
    color: #0CD9D9;
    padding: 8px 16px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.85rem;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.wishlist-inline-btn:hover[b-dy3c5y86mp] {
    background: rgba(12, 217, 217, 0.2);
    color: #fff;
}

@media (max-width: 992px) {
    .wishlist-inline-cta.desktop-only[b-dy3c5y86mp] {
        display: none !important;
    }

    .calculator-hint.desktop-only[b-dy3c5y86mp] {
        display: none !important;
    }
}

/* BE Calculator CTA - After accounts */
.be-calc-cta[b-dy3c5y86mp] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
    margin-bottom: 8px;
    padding: 14px 20px;
    text-decoration: none;
    color: var(--text-primary);
    background: linear-gradient(135deg, rgba(255, 135, 73, 0.08) 0%, rgba(255, 135, 73, 0.02) 100%);
    border: 1px dashed rgba(255, 135, 73, 0.3);
    border-radius: 10px;
    transition: all 0.25s ease;
}

.be-calc-cta:hover[b-dy3c5y86mp] {
    background: linear-gradient(135deg, rgba(255, 135, 73, 0.15) 0%, rgba(255, 135, 73, 0.05) 100%);
    border-color: rgba(255, 135, 73, 0.5);
    transform: translateX(4px);
}

.be-calc-cta__icon[b-dy3c5y86mp] {
    width: 48px;
    height: 48px;
    object-fit: contain;
    margin: -12px 0;
    flex-shrink: 0;
}

.be-calc-cta__text[b-dy3c5y86mp] {
    flex: 1;
    font-size: 0.9rem;
    color: var(--text-muted);
}

.be-calc-cta__text strong[b-dy3c5y86mp] {
    color: #FF8749;
    font-weight: 600;
}

/* Light mode: stronger border and background */
html:not([data-theme="dark"]) .be-calc-cta[b-dy3c5y86mp] {
    background: linear-gradient(135deg, rgba(255, 135, 73, 0.12) 0%, rgba(255, 135, 73, 0.04) 100%);
    border: 1px dashed rgba(255, 135, 73, 0.5);
}

html:not([data-theme="dark"]) .be-calc-cta__text[b-dy3c5y86mp] {
    color: #444;
}

html:not([data-theme="dark"]) .be-calc-cta__text strong[b-dy3c5y86mp] {
    color: #d65a20;
}

.be-calc-cta__arrow[b-dy3c5y86mp] {
    color: #FF8749;
    opacity: 0.7;
    transition: all 0.25s ease;
}

.be-calc-cta:hover .be-calc-cta__arrow[b-dy3c5y86mp] {
    opacity: 1;
    transform: translateX(3px);
}

@media (max-width: 992px) {
    .be-calc-cta.desktop-only[b-dy3c5y86mp] {
        display: none !important;
    }
}
/* /Shared/AccountValueCalculatorWidget.razor.rz.scp.css */
.account-value-calculator[b-4ymfdspgdt] {
        background: var(--bg-secondary);
        border-radius: 16px;
        padding: 32px;
        box-shadow: 0 4px 20px rgba(21, 32, 55, 0.1);
        margin: 32px 0;
    }

    .account-value-calculator__header[b-4ymfdspgdt] {
        text-align: center;
        margin-bottom: 32px;
    }

    .account-value-calculator__title[b-4ymfdspgdt] {
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--color-header);
        margin: 0 0 8px 0;
    }

    .account-value-calculator__subtitle[b-4ymfdspgdt] {
        font-size: 1rem;
        color: #6b7280;
        margin: 0;
    }

    .account-value-calculator__inputs[b-4ymfdspgdt] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
        margin-bottom: 32px;
    }

    .calculator-input-group[b-4ymfdspgdt] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .calculator-label[b-4ymfdspgdt] {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--color-header);
    }

    .calculator-input-wrapper[b-4ymfdspgdt] {
        display: flex;
        align-items: center;
        background: var(--bg-tertiary);
        border: 2px solid var(--border-color);
        border-radius: 8px;
        padding: 0 12px;
        transition: all 0.3s ease;
        min-height: 48px;
        height: 48px;
    }

    .calculator-input-wrapper:focus-within[b-4ymfdspgdt] {
        border-color: var(--color-primary);
        box-shadow: 0 0 0 3px rgba(255, 135, 73, 0.1);
    }

    .calculator-currency[b-4ymfdspgdt] {
        font-weight: 600;
        color: var(--color-header);
        margin-right: 4px;
        display: flex;
        align-items: center;
        line-height: 1;
    }

    .calculator-input[b-4ymfdspgdt] {
        flex: 1;
        border: none;
        outline: none;
        padding: 12px 0;
        font-size: 1rem;
        font-weight: 600;
        color: var(--color-header);
        background: transparent;
        line-height: 1.5;
        vertical-align: middle;
    }

    /* Hide spinner arrows for better alignment */
    .calculator-input[b-4ymfdspgdt]::-webkit-outer-spin-button,
    .calculator-input[b-4ymfdspgdt]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .calculator-input[type=number][b-4ymfdspgdt] {
        -moz-appearance: textfield;
    }

    .calculator-suffix[b-4ymfdspgdt] {
        font-weight: 600;
        color: #6b7280;
        margin-left: 8px;
        display: inline-flex;
        align-items: center;
        line-height: 1.5;
        height: 100%;
        vertical-align: middle;
    }

    .account-value-calculator__results[b-4ymfdspgdt] {
        margin-bottom: 32px;
    }

    .value-row[b-4ymfdspgdt] {
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-start;
        align-items: flex-start;
        list-style: none;
        padding: 0;
        margin: 0 -13px;
        gap: 0;
    }

    .value-row__item[b-4ymfdspgdt] {
        display: flex;
        width: calc(1 / 3 * 100% - 26px);
        min-width: 200px;
        max-width: calc(1 / 3 * 100% - 26px);
        flex-flow: row nowrap;
        justify-content: space-between;
        align-items: center;
        border-radius: 8px;
        box-shadow: 0 6px 24px 0 rgba(120, 141, 162, 0.13);
        background: var(--bg-tertiary);
        margin: 0 13px 26px;
        padding: 14px 16px;
        border: 3px solid transparent;
        transition: all 0.15s ease;
        flex: 0 1 calc(1 / 3 * 100% - 26px);
        box-sizing: border-box;
        overflow: hidden;
    }

    .value-row__item:hover[b-4ymfdspgdt] {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px 0 rgba(120, 141, 162, 0.18);
    }

    .value-row__item--primary[b-4ymfdspgdt] {
        border-left: 4px solid var(--color-primary);
    }

    .value-row__item--secondary[b-4ymfdspgdt] {
        border-left: 4px solid #22c55e;
    }

    .value-row__item--tertiary[b-4ymfdspgdt] {
        border-left: 4px solid #3b82f6;
    }

    .value-row__left[b-4ymfdspgdt] {
        display: flex;
        align-items: center;
        gap: 12px;
        flex: 1 1 auto;
        min-width: 0;
        padding-right: 8px;
    }

    .value-row__icon[b-4ymfdspgdt] {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, rgba(255, 135, 73, 0.1) 0%, rgba(255, 135, 73, 0.05) 100%);
        color: var(--color-primary);
    }

    .value-row__item--secondary .value-row__icon[b-4ymfdspgdt] {
        background: linear-gradient(135deg, rgba(34, 197, 94, 0.1) 0%, rgba(34, 197, 94, 0.05) 100%);
        color: #22c55e;
    }

    .value-row__item--tertiary .value-row__icon[b-4ymfdspgdt] {
        background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(59, 130, 246, 0.05) 100%);
        color: #3b82f6;
    }

    .value-row__content[b-4ymfdspgdt] {
        flex: 1;
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .value-row__label[b-4ymfdspgdt] {
        font-size: 0.8125rem;
        font-weight: 600;
        color: var(--color-header);
        margin-bottom: 3px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .value-row__description[b-4ymfdspgdt] {
        font-size: 0.6875rem;
        color: #6b7280;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .value-row__right[b-4ymfdspgdt] {
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;
        margin-left: auto;
        text-align: right;
    }

    .value-row__value[b-4ymfdspgdt] {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--color-header);
        white-space: nowrap;
        flex-shrink: 0;
    }

    .comparison-section[b-4ymfdspgdt] {
        background: var(--bg-secondary);
        border-radius: 12px;
        padding: 24px;
        margin-bottom: 24px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        border: 1px solid var(--border-color);
    }

    .comparison-title[b-4ymfdspgdt] {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--color-header);
        margin: 0 0 20px 0;
        text-align: center;
    }

    .comparison-chart[b-4ymfdspgdt] {
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin-bottom: 16px;
    }

    .comparison-bar[b-4ymfdspgdt] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .comparison-bar__label[b-4ymfdspgdt] {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--color-header);
    }

    .comparison-bar__container[b-4ymfdspgdt] {
        height: 40px;
        background: var(--bg-tertiary);
        border-radius: 8px;
        overflow: hidden;
        position: relative;
    }

    .comparison-bar__fill[b-4ymfdspgdt] {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: width 0.5s ease;
        position: relative;
    }

    .comparison-bar__fill--grinding[b-4ymfdspgdt] {
        background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
        width: 100%;
    }

    .comparison-bar__fill--purchased[b-4ymfdspgdt] {
        background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
        width: 5%;
        min-width: 80px;
    }

    .comparison-bar__text[b-4ymfdspgdt] {
        font-size: 0.875rem;
        font-weight: 600;
        color: #ffffff;
        white-space: nowrap;
    }

    .comparison-savings[b-4ymfdspgdt] {
        text-align: center;
    }

    .savings-badge[b-4ymfdspgdt] {
        display: inline-block;
        background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
        color: #ffffff;
        padding: 12px 24px;
        border-radius: 999px;
        font-weight: 600;
        font-size: 1rem;
        box-shadow: 0 4px 12px rgba(255, 135, 73, 0.3);
    }

    .value-breakdown[b-4ymfdspgdt] {
        background: var(--bg-secondary);
        border-radius: 12px;
        padding: 24px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        border: 1px solid var(--border-color);
    }

    .breakdown-title[b-4ymfdspgdt] {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--color-header);
        margin: 0 0 20px 0;
        text-align: center;
    }

    .breakdown-list[b-4ymfdspgdt] {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .breakdown-item[b-4ymfdspgdt] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 0;
        border-bottom: 1px solid var(--border-color);
    }

    .breakdown-item--total[b-4ymfdspgdt] {
        border-bottom: none;
        border-top: 2px solid var(--color-primary);
        padding-top: 16px;
        margin-top: 8px;
    }

    .breakdown-label[b-4ymfdspgdt] {
        font-size: 0.95rem;
        color: var(--color-header);
        font-weight: 500;
    }

    .breakdown-value[b-4ymfdspgdt] {
        font-size: 1.1rem;
        font-weight: 600;
        color: var(--color-header);
    }

    .breakdown-value--positive[b-4ymfdspgdt] {
        color: #22c55e;
    }

    .breakdown-value--total[b-4ymfdspgdt] {
        font-size: 1.5rem;
        color: var(--color-primary);
    }

    .account-value-calculator__placeholder[b-4ymfdspgdt] {
        text-align: center;
        padding: 48px 24px;
        color: #9ca3af;
    }

    .placeholder-icon[b-4ymfdspgdt] {
        margin: 0 auto 16px;
        color: #d1d5db;
    }

    @media (max-width: 768px) {
        .account-value-calculator[b-4ymfdspgdt] {
            display: none;
        }
    }
/* /Shared/BanFreeCounterComponent.razor.rz.scp.css */
/* ============================================
   Ban-Free Streak Counter
   ============================================ */
.ban-free-counter[b-b8dt2nikub] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(5, 150, 105, 0.05) 100%);
    border-top: 1px solid rgba(16, 185, 129, 0.2);
    border-bottom: 1px solid rgba(16, 185, 129, 0.2);
    padding: 16px 0;
}

.ban-free-counter__inner[b-b8dt2nikub] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    padding: 0 20px;
}

.ban-free-counter__stat[b-b8dt2nikub] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.ban-free-counter__stat--highlight[b-b8dt2nikub] {
    position: relative;
}

.ban-free-counter__shield[b-b8dt2nikub] {
    font-size: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: pulse-shield-b-b8dt2nikub 2s ease-in-out infinite;
    filter: drop-shadow(0 0 10px rgba(16, 185, 129, 0.5));
}

@keyframes pulse-shield-b-b8dt2nikub {

    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 10px rgba(16, 185, 129, 0.5));
    }

    50% {
        transform: scale(1.15);
        filter: drop-shadow(0 0 20px rgba(16, 185, 129, 0.8));
    }
}

.ban-free-counter__number[b-b8dt2nikub] {
    font-size: 28px;
    font-weight: 700;
    color: var(--color-header);
    font-family: 'Montserrat', sans-serif;
    letter-spacing: -0.5px;
}

.ban-free-counter__number--zero[b-b8dt2nikub] {
    color: #10b981;
    text-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
}

.ban-free-counter__label[b-b8dt2nikub] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--color-text);
    opacity: 0.7;
}

/* Dark Mode */
[data-theme="dark"] .ban-free-counter[b-b8dt2nikub] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(5, 150, 105, 0.03) 100%);
}

/* Mobile */
@media (max-width: 480px) {
    .ban-free-counter__inner[b-b8dt2nikub] {
        gap: 20px;
    }

    .ban-free-counter__number[b-b8dt2nikub] {
        font-size: 22px;
    }

    .ban-free-counter__label[b-b8dt2nikub] {
        font-size: 10px;
    }

    .ban-free-counter__shield[b-b8dt2nikub] {
        left: -18px;
        font-size: 16px;
    }
}
/* /Shared/BlogSaveForLater.razor.rz.scp.css */
/* BlogSaveForLater.razor.css - Scoped styles for Blog Save Button */

.blog-save-button[b-7szhc76qwr] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    color: var(--color-text);
    cursor: pointer;
    transition: all 0.3s ease;
}

.blog-save-button:hover[b-7szhc76qwr] {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.2);
}

.blog-save-button.saved[b-7szhc76qwr] {
    background: linear-gradient(135deg, var(--color-primary) 0%, #FF6B2B 100%);
    border-color: var(--color-primary);
    color: #fff;
}

.blog-save-button.saved:hover[b-7szhc76qwr] {
    background: linear-gradient(135deg, #FF6B2B 0%, var(--color-primary) 100%);
}

.blog-save-button svg[b-7szhc76qwr] {
    flex-shrink: 0;
}
/* /Shared/CheckoutComponent.razor.rz.scp.css */
.order-form__totalbox[b-26952pt55v] {
    margin-top: 5px !important;
    /* Reduced spacing */
    padding-top: 10px !important;
    border-top: 1px solid var(--border-color);
}

.order-form__breakdown[b-26952pt55v] {
    margin-top: 10px !important;
    /* Reduced spacing */
    margin-bottom: 20px !important;
    padding: 0;
}

.order-form__breakdown-row[b-26952pt55v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    /* Reduced from 10px */
    font-size: 16px;
    line-height: 1.5;
}

.order-form__breakdown-row--discount[b-26952pt55v] {
    color: var(--color-success);
}

.order-form__breakdown-row--discount .order-form__breakdown-value[b-26952pt55v] {
    color: var(--color-success);
    font-weight: 500;
}

.order-form__breakdown-row--total[b-26952pt55v] {
    padding-top: 12px;
    margin-top: 8px;
    font-weight: 600;
    font-size: 18px;
}

.order-form__breakdown-row--total.has-separator[b-26952pt55v] {
    border-top: 1px solid var(--border-color);
    padding-top: 12px;
    margin-top: 8px;
}

.order-form__breakdown-row--total:not(.has-separator)[b-26952pt55v] {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.order-form__breakdown-label[b-26952pt55v] {
    color: var(--text-muted);
    font-weight: 400;
    padding-right: 15px;
}

.order-form__breakdown-row--total .order-form__breakdown-label[b-26952pt55v] {
    color: var(--text-secondary);
    font-weight: 600;
}

.order-form__breakdown-value[b-26952pt55v] {
    color: var(--text-secondary);
    font-weight: 500;
    text-align: right;
    padding-left: 15px;
}

.order-form__breakdown-value--highlight[b-26952pt55v] {
    color: #28a745 !important;
    font-weight: 700;
    font-size: 20px;
}

/* Security Badges */
.checkout-security-badges[b-26952pt55v] {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    padding: 12px 0;
    width: 100%;
    box-sizing: border-box;
}

.checkout-security-badge[b-26952pt55v] {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 6px;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    white-space: nowrap;
    flex-shrink: 0;
}

.checkout-security-badge svg[b-26952pt55v] {
    flex-shrink: 0;
    color: #22c55e;
    width: 14px;
    height: 14px;
}

/* Responsive adjustments for security badges */
@media only screen and (max-width: 400px) {
    .checkout-security-badges[b-26952pt55v] {
        gap: 8px;
        padding: 8px 0;
    }

    .checkout-security-badge[b-26952pt55v] {
        font-size: 10px;
        gap: 4px;
        flex: 1 1 calc(50% - 4px);
        min-width: 0;
        justify-content: center;
    }

    .checkout-security-badge svg[b-26952pt55v] {
        width: 11px;
        height: 11px;
    }
}

@media only screen and (min-width: 401px) and (max-width: 480px) {
    .checkout-security-badges[b-26952pt55v] {
        gap: 10px;
        padding: 10px 0;
    }

    .checkout-security-badge[b-26952pt55v] {
        font-size: 11px;
        gap: 5px;
    }

    .checkout-security-badge svg[b-26952pt55v] {
        width: 12px;
        height: 12px;
    }
}

/* Trust Badges */
.checkout-trust-badges[b-26952pt55v] {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    padding: 12px 0;
    border-top: 1px solid var(--border-color);
    padding-top: 15px;
    width: 100%;
    box-sizing: border-box;
}

.checkout-trust-badge[b-26952pt55v] {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 6px;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    white-space: nowrap;
    flex-shrink: 0;
}

.checkout-trust-badge svg[b-26952pt55v] {
    flex-shrink: 0;
    color: var(--color-primary);
    width: 14px;
    height: 14px;
}

/* Responsive adjustments for trust badges */
@media only screen and (max-width: 400px) {
    .checkout-trust-badges[b-26952pt55v] {
        gap: 8px;
        padding: 8px 0;
        padding-top: 12px;
    }

    .checkout-trust-badge[b-26952pt55v] {
        font-size: 10px;
        gap: 4px;
        flex: 1 1 calc(50% - 4px);
        min-width: 0;
        justify-content: center;
    }

    .checkout-trust-badge svg[b-26952pt55v] {
        width: 11px;
        height: 11px;
    }
}

@media only screen and (min-width: 401px) and (max-width: 480px) {
    .checkout-trust-badges[b-26952pt55v] {
        gap: 10px;
        padding: 10px 0;
        padding-top: 12px;
    }

    .checkout-trust-badge[b-26952pt55v] {
        font-size: 11px;
        gap: 5px;
    }

    .checkout-trust-badge svg[b-26952pt55v] {
        width: 12px;
        height: 12px;
    }
}

/* Stripe Button Styling */
.button.--stripe[b-26952pt55v] {
    background: linear-gradient(135deg, #635BFF 0%, #7C3AED 100%);
    color: #FFFFFF;
    border: none;
    box-shadow: 0 4px 12px rgba(99, 91, 255, 0.3);
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
}

.button.--stripe:hover:not(:disabled)[b-26952pt55v] {
    background: linear-gradient(135deg, #5851EA 0%, #6D28D9 100%);
    box-shadow: 0 6px 16px rgba(99, 91, 255, 0.4);
    transform: translateY(-1px);
}

.button.--stripe:active:not(:disabled)[b-26952pt55v] {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(99, 91, 255, 0.3);
}

.button.--stripe:disabled[b-26952pt55v] {
    opacity: 0.7;
    cursor: not-allowed;
}

.stripe-button-content[b-26952pt55v] {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.stripe-button-logo[b-26952pt55v] {
    flex-shrink: 0;
    width: 60px;
    height: auto;
    max-height: 20px;
    filter: brightness(0) invert(1);
}

/* Button Loading State */
.button--loading[b-26952pt55v] {
    opacity: 0.8;
    cursor: not-allowed;
    pointer-events: none;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.button--loading .button-spinner[b-26952pt55v] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #FFFFFF;
    border-radius: 50%;
    animation: button-spin-b-26952pt55v 0.6s linear infinite;
    flex-shrink: 0;
}

@keyframes button-spin-b-26952pt55v {
    to {
        transform: rotate(360deg);
    }
}

/* Button spacing */
.order-form__totalbox .button[b-26952pt55v] {
    margin-top: 0 !important;
}

/* Error and Success Messages */
.error-message[b-26952pt55v] {
    display: flex;
    align-items: flex-start;
    padding: 10px 12px;
    margin-top: 8px;
    background-color: var(--bg-error-light);
    border-left: 3px solid var(--color-error);
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.4;
}

.error-message span[b-26952pt55v] {
    color: var(--color-error-dark);
    display: flex;
    align-items: center;
    gap: 6px;
}

.error-message span[b-26952pt55v]::before {
    content: "âš ";
    font-size: 14px;
    flex-shrink: 0;
}

.success-message[b-26952pt55v] {
    display: flex;
    align-items: flex-start;
    padding: 10px 12px;
    margin-top: 8px;
    background-color: var(--bg-success-light);
    border-left: 3px solid var(--color-success);
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.4;
}

.success-message span[b-26952pt55v] {
    color: var(--color-success-dark);
    display: flex;
    align-items: center;
    gap: 6px;
}

.success-message span[b-26952pt55v]::before {
    content: "✓";
    font-size: 14px;
    font-weight: bold;
    flex-shrink: 0;
}

.input-error[b-26952pt55v] {
    border-color: #e53e3e !important;
}

/* Discord Support Link */
.checkout-discord-support[b-26952pt55v] {
    margin: 12px 0 16px 0;
    padding: 0;
    width: 100%;
}

.checkout-discord-link[b-26952pt55v] {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    background-color: #5865F2;
    color: #FFFFFF;
    text-decoration: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.2s ease;
    border: 1px solid #5865F2;
    width: 100%;
    box-sizing: border-box;
}

.checkout-discord-link:hover[b-26952pt55v] {
    background-color: #4752C4;
    border-color: #4752C4;
    color: #FFFFFF;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(88, 101, 242, 0.2);
}

.checkout-discord-link:active[b-26952pt55v] {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(88, 101, 242, 0.2);
}

.checkout-discord-link svg[b-26952pt55v] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}

.checkout-discord-link span[b-26952pt55v] {
    white-space: nowrap;
}

/* Mobile adjustments for Discord link */
@media (max-width: 480px) {
    .checkout-discord-link[b-26952pt55v] {
        font-size: 12px;
        padding: 9px 14px;
        gap: 6px;
    }

    .checkout-discord-link svg[b-26952pt55v] {
        width: 16px;
        height: 16px;
    }
}

/* Mobile Checkout Improvements - Better Touch Targets & Spacing */
@media (max-width: 768px) {
    .order-form__payment-checkout-row[b-26952pt55v] {
        flex-direction: column;
        align-items: stretch !important;
    }

    .order-form__payment-section[b-26952pt55v] {
        width: 100%;
    }

    .order-form__checkout-button-container[b-26952pt55v] {
        width: 100%;
        min-width: unset;
    }

    /* Increase input height for better touch targets (minimum 44px) */
    .order-form__input[b-26952pt55v] {
        height: 48px !important;
        font-size: 16px !important;
        /* Prevents zoom on iOS */
        padding: 12px 16px !important;
    }

    /* Increase button height for better touch targets */
    .button.--w-100[b-26952pt55v] {
        min-height: 50px !important;
        padding: 16px 24px !important;
        font-size: 16px !important;
    }

    /* Improve btn-form (Apply/Remove coupon buttons) */
    .btn-form[b-26952pt55v] {
        min-height: 48px !important;
        padding: 12px 20px !important;
        font-size: 15px !important;
    }

    /* Increase spacing between form elements */
    .order-form__box[b-26952pt55v] {
        margin-bottom: 20px !important;
    }

    .order-form__box.--pb-20[b-26952pt55v] {
        padding-bottom: 24px !important;
    }

    .order-form__row[b-26952pt55v] {
        padding-bottom: 24px !important;
    }

    .order-form__label[b-26952pt55v] {
        margin-bottom: 8px !important;
        font-size: 14px !important;
    }

    /* Better spacing for payment system selection */
    .payment-select__label[b-26952pt55v] {
        min-height: 60px !important;
        padding: 10px !important;
    }

    /* Increase spacing around badges */
    .checkout-security-badges[b-26952pt55v],
    .checkout-trust-badges[b-26952pt55v] {
        margin-bottom: 24px !important;
        padding: 16px 0 !important;
    }

    /* Better spacing for total box */
    .order-form__totalbox[b-26952pt55v] {
        margin-top: 10px !important;
        padding-top: 20px !important;
    }

    /* Increase spacing between breakdown rows */
    .order-form__breakdown[b-26952pt55v] {
        margin-bottom: 24px !important;
    }

    .order-form__breakdown-row[b-26952pt55v] {
        padding: 10px 0 !important;
    }
}

/* Extra small mobile devices (≤400px) */
@media (max-width: 400px) {
    .order-form__input[b-26952pt55v] {
        height: 50px !important;
        padding: 14px 16px !important;
    }

    .button.--w-100[b-26952pt55v] {
        min-height: 52px !important;
        padding: 18px 20px !important;
    }

    .btn-form[b-26952pt55v] {
        min-height: 50px !important;
        padding: 14px 18px !important;
    }

    /* Stack coupon input and button vertically on very small screens */
    .order-form__rowbox[b-26952pt55v] {
        flex-direction: column !important;
        gap: 12px !important;
    }

    .order-form__input.--wrow-100[b-26952pt55v] {
        border-radius: 8px !important;
        width: 100% !important;
    }

    .btn-form[b-26952pt55v] {
        width: 100% !important;
        border-radius: 8px !important;
    }
}

/* Gift Purchase Section */
.order-form__gift-section[b-26952pt55v] {
    margin-top: 16px;
    padding: 16px;
    background: linear-gradient(135deg, rgba(79, 203, 205, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%);
    border: 1px solid rgba(79, 203, 205, 0.2);
    border-radius: 12px;
}

.order-form__gift-toggle[b-26952pt55v] {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    font-weight: 500;
    user-select: none;
    position: relative;
}

.order-form__gift-toggle input[type="checkbox"][b-26952pt55v] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.gift-checkbox-custom[b-26952pt55v] {
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #4FCBCD;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.order-form__gift-toggle input:checked~.gift-checkbox-custom[b-26952pt55v] {
    background-color: #4FCBCD;
}

.gift-checkbox-custom[b-26952pt55v]:after {
    content: "";
    display: none;
    width: 5px;
    height: 10px;
    border: solid #0F172A;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    margin-bottom: 2px;
}

.order-form__gift-toggle input:checked~.gift-checkbox-custom[b-26952pt55v]:after {
    display: block;
}

.gift-label[b-26952pt55v] {
    font-size: 15px;
    color: var(--color-header);
    font-weight: 600;
}

.order-form__gift-hint[b-26952pt55v] {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 8px;
    margin-bottom: 0;
}
/* /Shared/CustomerReviewsWidgetComponent.razor.rz.scp.css */
/* CustomerReviewsWidgetComponent.razor.css - Scoped styles for Reviews Widget */

.customer-reviews-widget[b-l4o2gvgbs4] {
    width: 100%;
    padding: 30px;
    background: linear-gradient(135deg, rgba(12, 217, 217, 0.03) 0%, rgba(255, 135, 73, 0.03) 100%);
    border: 1px solid rgba(12, 217, 217, 0.15);
    border-radius: 12px;
    margin: 40px 0;
}

.customer-reviews-widget__header[b-l4o2gvgbs4] {
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(12, 217, 217, 0.1);
}

.customer-reviews-widget__header h3[b-l4o2gvgbs4] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 10px;
}

.customer-reviews-widget__carousel[b-l4o2gvgbs4] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 25px;
}

.review-card[b-l4o2gvgbs4] {
    background: #FFFFFF;
    border: 1px solid rgba(47, 50, 56, 0.1);
    border-radius: 10px;
    padding: 20px;
    transition: all 0.3s ease;
}

.review-card:hover[b-l4o2gvgbs4] {
    border-color: rgba(12, 217, 217, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(12, 217, 217, 0.1);
}
/* /Shared/DailyDropOrbComponent.razor.rz.scp.css */
/* ============================================
   Daily Drop Orb - Premium Floating Design
   ============================================ */
.daily-drop[b-7o59k5a1ne] {
    position: fixed;
    bottom: 150px;
    right: 20px;
    z-index: 1000;
    cursor: pointer;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    /* Completely transparent - no background */
    background: transparent;
}

.daily-drop--visible[b-7o59k5a1ne] {
    opacity: 1;
    transform: translateY(0);
}

.daily-drop--claimed[b-7o59k5a1ne] {
    opacity: 0.5;
    filter: grayscale(50%);
}

.daily-drop__orb[b-7o59k5a1ne] {
    position: relative;
    width: 70px;
    height: 70px;
    animation: float-b-7o59k5a1ne 3s ease-in-out infinite;
    /* No background - pure floating */
    background: transparent;
}

.daily-drop__image[b-7o59k5a1ne] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    /* Strong glowing effect */
    filter: drop-shadow(0 0 20px rgba(0, 200, 255, 0.8)) drop-shadow(0 0 40px rgba(0, 150, 255, 0.5)) drop-shadow(0 0 60px rgba(0, 100, 255, 0.3));
    transition: filter 0.3s ease, transform 0.3s ease;
}

.daily-drop:hover .daily-drop__image[b-7o59k5a1ne] {
    filter: drop-shadow(0 0 30px rgba(0, 200, 255, 1)) drop-shadow(0 0 50px rgba(0, 150, 255, 0.7)) drop-shadow(0 0 80px rgba(0, 100, 255, 0.5));
    transform: scale(1.15);
}

/* Animated glow ring */
.daily-drop__glow[b-7o59k5a1ne] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle,
            rgba(0, 200, 255, 0.4) 0%,
            rgba(0, 150, 255, 0.2) 40%,
            transparent 70%);
    animation: pulse-glow-b-7o59k5a1ne 2s ease-in-out infinite;
    pointer-events: none;
    border-radius: 50%;
}

@keyframes pulse-glow-b-7o59k5a1ne {

    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 0.4;
    }
}

/* Sparkle particles */
.daily-drop__particles[b-7o59k5a1ne] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120px;
    height: 120px;
    transform: translate(-50%, -50%);
    background-image:
        radial-gradient(2px 2px at 20px 30px, rgba(255, 255, 255, 0.9), transparent),
        radial-gradient(2px 2px at 40px 70px, rgba(0, 200, 255, 0.8), transparent),
        radial-gradient(2px 2px at 70px 40px, rgba(100, 200, 255, 0.9), transparent),
        radial-gradient(2px 2px at 90px 60px, rgba(0, 200, 255, 0.7), transparent),
        radial-gradient(1px 1px at 30px 80px, rgba(255, 255, 255, 0.8), transparent),
        radial-gradient(1px 1px at 80px 20px, rgba(0, 200, 255, 0.6), transparent);
    animation: sparkle-b-7o59k5a1ne 1.5s linear infinite;
    pointer-events: none;
}

@keyframes sparkle-b-7o59k5a1ne {

    0%,
    100% {
        opacity: 0.4;
        transform: translate(-50%, -50%) rotate(0deg);
    }

    50% {
        opacity: 1;
        transform: translate(-50%, -50%) rotate(180deg);
    }
}

.daily-drop__hint[b-7o59k5a1ne] {
    position: absolute;
    bottom: -28px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    font-size: 12px;
    font-weight: 700;
    color: #00c8ff;
    text-shadow: 0 0 15px rgba(0, 200, 255, 0.8),
        0 0 30px rgba(0, 200, 255, 0.4);
    animation: blink-b-7o59k5a1ne 2s ease-in-out infinite;
    letter-spacing: 1px;
}

@keyframes blink-b-7o59k5a1ne {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.6;
    }
}

@keyframes float-b-7o59k5a1ne {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-8px);
    }
}

/* Opening Animation */
.daily-drop--opening .daily-drop__orb[b-7o59k5a1ne] {
    animation: shake-b-7o59k5a1ne 0.5s ease-in-out;
}

@keyframes shake-b-7o59k5a1ne {

    0%,
    100% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(-12deg);
    }

    75% {
        transform: rotate(12deg);
    }
}

/* ============================================
   Modal - Premium Glassmorphism Design
   ============================================ */
.daily-drop-modal[b-7o59k5a1ne] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    animation: fadeIn-b-7o59k5a1ne 0.4s ease;
}

@keyframes fadeIn-b-7o59k5a1ne {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.daily-drop-modal__content[b-7o59k5a1ne] {
    background: linear-gradient(145deg,
            rgba(15, 23, 42, 0.95) 0%,
            rgba(30, 41, 59, 0.9) 50%,
            rgba(15, 23, 42, 0.95) 100%);
    border: 1px solid transparent;
    background-clip: padding-box;
    border-radius: 24px;
    padding: 48px 40px;
    text-align: center;
    max-width: 420px;
    width: 90%;
    position: relative;
    /* Premium glow border effect */
    box-shadow:
        0 0 0 1px rgba(0, 200, 255, 0.3),
        0 0 60px rgba(0, 200, 255, 0.15),
        0 25px 50px -12px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: modalSlideIn-b-7o59k5a1ne 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes modalSlideIn-b-7o59k5a1ne {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* Decorative corner accents */
.daily-drop-modal__content[b-7o59k5a1ne]::before,
.daily-drop-modal__content[b-7o59k5a1ne]::after {
    content: '';
    position: absolute;
    width: 60px;
    height: 60px;
    border: 2px solid transparent;
    pointer-events: none;
}

.daily-drop-modal__content[b-7o59k5a1ne]::before {
    top: -1px;
    left: -1px;
    border-top-color: rgba(0, 200, 255, 0.6);
    border-left-color: rgba(0, 200, 255, 0.6);
    border-radius: 24px 0 0 0;
}

.daily-drop-modal__content[b-7o59k5a1ne]::after {
    bottom: -1px;
    right: -1px;
    border-bottom-color: rgba(0, 200, 255, 0.6);
    border-right-color: rgba(0, 200, 255, 0.6);
    border-radius: 0 0 24px 0;
}

.daily-drop-modal__close[b-7o59k5a1ne] {
    position: absolute;
    top: 16px;
    right: 16px;
    background: rgba(100, 116, 139, 0.2);
    border: 1px solid rgba(100, 116, 139, 0.3);
    color: #94a3b8;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.daily-drop-modal__close:hover[b-7o59k5a1ne] {
    background: rgba(239, 68, 68, 0.2);
    border-color: rgba(239, 68, 68, 0.4);
    color: #ef4444;
    transform: rotate(90deg);
}

.daily-drop-modal__orb-container[b-7o59k5a1ne] {
    margin-bottom: 24px;
}

.daily-drop-modal__orb[b-7o59k5a1ne] {
    width: 140px;
    height: 140px;
    object-fit: contain;
    filter: drop-shadow(0 0 40px rgba(0, 200, 255, 0.9)) drop-shadow(0 0 80px rgba(0, 150, 255, 0.6));
}

.daily-drop-modal__orb--cracking[b-7o59k5a1ne] {
    animation: crack-b-7o59k5a1ne 2s ease-in-out forwards;
}

@keyframes crack-b-7o59k5a1ne {
    0% {
        transform: scale(1) rotate(0deg);
        filter: drop-shadow(0 0 40px rgba(0, 200, 255, 0.9));
    }

    25% {
        transform: scale(1.1) rotate(-5deg);
    }

    50% {
        transform: scale(1.3) rotate(5deg);
        filter: drop-shadow(0 0 80px rgba(0, 200, 255, 1)) drop-shadow(0 0 120px rgba(255, 200, 0, 0.8)) brightness(1.8);
    }

    75% {
        transform: scale(0.9) rotate(-2deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
        filter: drop-shadow(0 0 40px rgba(0, 200, 255, 0.9));
    }
}

.daily-drop-modal__text[b-7o59k5a1ne] {
    color: #94a3b8;
    font-size: 15px;
    animation: pulse-b-7o59k5a1ne 1.5s ease-in-out infinite;
}

@keyframes pulse-b-7o59k5a1ne {

    0%,
    100% {
        opacity: 0.7;
    }

    50% {
        opacity: 1;
    }
}

/* Result Section - The Big Reveal */
.daily-drop-modal__result[b-7o59k5a1ne] {
    animation: resultReveal-b-7o59k5a1ne 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes resultReveal-b-7o59k5a1ne {
    from {
        opacity: 0;
        transform: scale(0.8);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.daily-drop-modal__icon[b-7o59k5a1ne] {
    font-size: 64px;
    margin-bottom: 16px;
    animation: bounce-b-7o59k5a1ne 0.6s ease;
}

@keyframes bounce-b-7o59k5a1ne {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }
}

.daily-drop-modal__title[b-7o59k5a1ne] {
    font-size: 28px;
    font-weight: 800;
    background: linear-gradient(135deg, #ffffff 0%, #00c8ff 50%, #ffffff 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin: 0 0 24px;
    animation: shimmer-b-7o59k5a1ne 2s linear infinite;
}

@keyframes shimmer-b-7o59k5a1ne {
    0% {
        background-position: 0% center;
    }

    100% {
        background-position: 200% center;
    }
}

.daily-drop-modal__code[b-7o59k5a1ne] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: linear-gradient(135deg,
            rgba(0, 200, 255, 0.15) 0%,
            rgba(0, 150, 200, 0.1) 100%);
    border: 2px solid rgba(0, 200, 255, 0.4);
    border-radius: 14px;
    padding: 18px 24px;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden;
}

/* Animated border glow */
.daily-drop-modal__code[b-7o59k5a1ne]::before {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(90deg,
            transparent,
            rgba(0, 200, 255, 0.4),
            transparent);
    animation: borderGlow-b-7o59k5a1ne 2s linear infinite;
    pointer-events: none;
}

@keyframes borderGlow-b-7o59k5a1ne {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

.daily-drop-modal__code code[b-7o59k5a1ne] {
    font-size: 22px;
    font-weight: 800;
    color: #00c8ff;
    letter-spacing: 3px;
    text-shadow: 0 0 20px rgba(0, 200, 255, 0.5);
    font-family: 'Courier New', monospace;
}

.daily-drop-modal__copy[b-7o59k5a1ne] {
    background: linear-gradient(135deg, #00c8ff 0%, #0099cc 100%);
    color: #0f172a;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.daily-drop-modal__copy:hover[b-7o59k5a1ne] {
    background: linear-gradient(135deg, #38bdf8 0%, #00c8ff 100%);
    transform: scale(1.05);
    box-shadow: 0 4px 15px rgba(0, 200, 255, 0.4);
}

/* ============================================
   Premium Reward Icon - Animated Gem with Rings
   ============================================ */
.daily-drop-modal__reward-icon[b-7o59k5a1ne] {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 0 auto 24px;
}

.reward-icon__glow[b-7o59k5a1ne] {
    position: absolute;
    inset: -20px;
    background: radial-gradient(circle, rgba(0, 200, 255, 0.4) 0%, transparent 70%);
    animation: rewardGlow-b-7o59k5a1ne 2s ease-in-out infinite;
}

@keyframes rewardGlow-b-7o59k5a1ne {

    0%,
    100% {
        opacity: 0.6;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }
}

.reward-icon__ring[b-7o59k5a1ne] {
    position: absolute;
    border: 2px solid rgba(0, 200, 255, 0.3);
    border-radius: 50%;
    animation: ringPulse-b-7o59k5a1ne 3s ease-out infinite;
}

.reward-icon__ring--1[b-7o59k5a1ne] {
    inset: 10px;
    animation-delay: 0s;
}

.reward-icon__ring--2[b-7o59k5a1ne] {
    inset: 0px;
    animation-delay: 0.5s;
}

.reward-icon__ring--3[b-7o59k5a1ne] {
    inset: -10px;
    animation-delay: 1s;
}

@keyframes ringPulse-b-7o59k5a1ne {
    0% {
        transform: scale(0.8);
        opacity: 0.8;
    }

    50% {
        transform: scale(1.2);
        opacity: 0;
    }

    100% {
        transform: scale(0.8);
        opacity: 0;
    }
}

.reward-icon__core[b-7o59k5a1ne] {
    position: absolute;
    inset: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 30, 50, 0.8);
    border-radius: 50%;
    border: 2px solid rgba(0, 200, 255, 0.5);
    animation: corePulse-b-7o59k5a1ne 2s ease-in-out infinite;
}

@keyframes corePulse-b-7o59k5a1ne {

    0%,
    100% {
        box-shadow: 0 0 20px rgba(0, 200, 255, 0.5);
    }

    50% {
        box-shadow: 0 0 40px rgba(0, 200, 255, 0.8), 0 0 60px rgba(200, 80, 192, 0.4);
    }
}

.reward-icon__gem[b-7o59k5a1ne] {
    width: 32px;
    height: 32px;
    filter: drop-shadow(0 0 8px rgba(0, 200, 255, 0.8));
}

.reward-particles[b-7o59k5a1ne] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.reward-particles span[b-7o59k5a1ne] {
    position: absolute;
    width: 4px;
    height: 4px;
    background: #00d4ff;
    border-radius: 50%;
    animation: particleFloat-b-7o59k5a1ne 3s ease-in-out infinite;
}

.reward-particles span:nth-child(1)[b-7o59k5a1ne] {
    top: 10%;
    left: 20%;
    animation-delay: 0s;
}

.reward-particles span:nth-child(2)[b-7o59k5a1ne] {
    top: 20%;
    right: 15%;
    animation-delay: 0.4s;
}

.reward-particles span:nth-child(3)[b-7o59k5a1ne] {
    bottom: 25%;
    left: 10%;
    animation-delay: 0.8s;
}

.reward-particles span:nth-child(4)[b-7o59k5a1ne] {
    bottom: 15%;
    right: 20%;
    animation-delay: 1.2s;
}

.reward-particles span:nth-child(5)[b-7o59k5a1ne] {
    top: 50%;
    left: 5%;
    animation-delay: 0.2s;
}

.reward-particles span:nth-child(6)[b-7o59k5a1ne] {
    top: 35%;
    right: 5%;
    animation-delay: 0.6s;
}

.reward-particles span:nth-child(7)[b-7o59k5a1ne] {
    bottom: 40%;
    left: 25%;
    animation-delay: 1s;
}

.reward-particles span:nth-child(8)[b-7o59k5a1ne] {
    bottom: 35%;
    right: 10%;
    animation-delay: 1.4s;
}

@keyframes particleFloat-b-7o59k5a1ne {

    0%,
    100% {
        transform: translateY(0) scale(1);
        opacity: 0.6;
    }

    50% {
        transform: translateY(-10px) scale(1.5);
        opacity: 1;
    }
}

/* ============================================
   Premium Title with Gradient Animation
   ============================================ */
.daily-drop-modal__title[b-7o59k5a1ne] {
    font-size: 26px;
    font-weight: 800;
    margin: 0 0 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.title-word[b-7o59k5a1ne] {
    color: #e2e8f0;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.title-word--highlight[b-7o59k5a1ne] {
    color: #00d4ff;
    text-shadow: 0 0 20px rgba(0, 200, 255, 0.5);
}

.title-discount[b-7o59k5a1ne] {
    font-size: 36px;
    font-weight: 900;
    background: linear-gradient(135deg, #f47e27 0%, #FFD93D 50%, #f47e27 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: shimmer-b-7o59k5a1ne 2s linear infinite;
    text-shadow: none;
}

@keyframes shimmer-b-7o59k5a1ne {
    0% {
        background-position: 0% center;
    }

    100% {
        background-position: 200% center;
    }
}

/* ============================================
   Premium Code Box
   ============================================ */
.daily-drop-modal__code-container[b-7o59k5a1ne] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px;
}

.code-box[b-7o59k5a1ne] {
    position: relative;
    background: linear-gradient(135deg, rgba(0, 40, 60, 0.9) 0%, rgba(0, 20, 40, 0.9) 100%);
    border-radius: 12px;
    padding: 14px 24px;
    overflow: hidden;
}

.code-box__border[b-7o59k5a1ne] {
    position: absolute;
    inset: 0;
    border-radius: 12px;
    padding: 2px;
    background: linear-gradient(90deg, #00d4ff, #c850c0, #00d4ff);
    background-size: 200% 100%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: borderRotate-b-7o59k5a1ne 3s linear infinite;
}

@keyframes borderRotate-b-7o59k5a1ne {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 200% 50%;
    }
}

.code-box__text[b-7o59k5a1ne] {
    font-size: 15px;
    font-weight: 700;
    color: #00d4ff;
    letter-spacing: 1.5px;
    text-shadow: 0 0 15px rgba(0, 200, 255, 0.5);
    font-family: 'Courier New', monospace;
    white-space: nowrap;
}

.copy-btn[b-7o59k5a1ne] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #00c8ff 0%, #0099cc 100%);
    color: #0f172a;
    border: none;
    padding: 12px 18px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.copy-btn__icon[b-7o59k5a1ne] {
    width: 16px;
    height: 16px;
}

.copy-btn:hover[b-7o59k5a1ne] {
    background: linear-gradient(135deg, #38bdf8 0%, #00c8ff 100%);
    transform: scale(1.05);
    box-shadow: 0 4px 15px rgba(0, 200, 255, 0.4);
}

/* ============================================
   Validity Notice
   ============================================ */
.daily-drop-modal__validity[b-7o59k5a1ne] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #64748b;
    font-size: 13px;
    margin-bottom: 24px;
}

.validity-icon[b-7o59k5a1ne] {
    width: 16px;
    height: 16px;
    color: #64748b;
}

/* ============================================
   Premium CTA Button
   ============================================ */
.daily-drop-modal__cta[b-7o59k5a1ne] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(135deg, #f47e27 0%, #FF6B2B 50%, #f47e27 100%);
    background-size: 200% auto;
    color: #fff;
    border: none;
    padding: 16px 36px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.4s;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 4px 20px rgba(244, 126, 39, 0.3);
}

.cta-text[b-7o59k5a1ne] {
    display: inline;
}

.cta-arrow[b-7o59k5a1ne] {
    width: 20px;
    height: 20px;
    transition: transform 0.3s;
}

.daily-drop-modal__cta:hover[b-7o59k5a1ne] {
    background-position: right center;
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(244, 126, 39, 0.5);
}

.daily-drop-modal__cta:hover .cta-arrow[b-7o59k5a1ne] {
    transform: translateX(4px);
}

/* ============================================
   Already Claimed State - Timer Icon
   ============================================ */
.daily-drop-modal__timer-icon[b-7o59k5a1ne] {
    position: relative;
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
}

.timer-icon__glow[b-7o59k5a1ne] {
    position: absolute;
    inset: -15px;
    background: radial-gradient(circle, rgba(0, 200, 255, 0.3) 0%, transparent 70%);
    animation: rewardGlow-b-7o59k5a1ne 2s ease-in-out infinite;
}

.timer-icon__svg[b-7o59k5a1ne] {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 15px rgba(0, 200, 255, 0.6));
}

.daily-drop-modal__countdown[b-7o59k5a1ne] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
}

.countdown-label[b-7o59k5a1ne] {
    color: #64748b;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.countdown-time[b-7o59k5a1ne] {
    color: #00d4ff;
    font-size: 24px;
    font-weight: 800;
    text-shadow: 0 0 20px rgba(0, 200, 255, 0.5);
    font-family: 'Courier New', monospace;
}

.daily-drop-modal__note[b-7o59k5a1ne] {
    color: #94a3b8;
    font-size: 14px;
    margin-bottom: 0;
}

/* Mobile Responsive */
@media (max-width: 480px) {
    .daily-drop[b-7o59k5a1ne] {
        bottom: 120px;
        right: 15px;
    }

    .daily-drop__orb[b-7o59k5a1ne] {
        width: 55px;
        height: 55px;
    }

    .daily-drop-modal__content[b-7o59k5a1ne] {
        padding: 36px 24px;
        margin: 16px;
    }

    .daily-drop-modal__title[b-7o59k5a1ne] {
        font-size: 22px;
    }

    .title-discount[b-7o59k5a1ne] {
        font-size: 28px;
    }

    .daily-drop-modal__code-container[b-7o59k5a1ne] {
        flex-direction: column;
        gap: 10px;
    }

    .code-box__text[b-7o59k5a1ne] {
        font-size: 13px;
        letter-spacing: 1px;
    }

    .daily-drop-modal__cta[b-7o59k5a1ne] {
        width: 100%;
        padding: 14px 24px;
    }
}

/* ============================================
   LIGHT MODE OVERRIDES
   ============================================ */
[data-theme="light"] .daily-drop-modal__content[b-7o59k5a1ne] {
    background: linear-gradient(145deg,
            rgba(255, 255, 255, 0.95) 0%,
            rgba(240, 248, 255, 0.95) 100%);
    border: 1px solid rgba(0, 150, 200, 0.2);
}

[data-theme="light"] .daily-drop-modal__content[b-7o59k5a1ne]::before,
[data-theme="light"] .daily-drop-modal__content[b-7o59k5a1ne]::after {
    border-color: rgba(0, 150, 200, 0.4);
}

[data-theme="light"] .daily-drop-modal__close[b-7o59k5a1ne] {
    background: rgba(100, 116, 139, 0.1);
    border-color: rgba(100, 116, 139, 0.2);
    color: #64748b;
}

[data-theme="light"] .daily-drop-modal__close:hover[b-7o59k5a1ne] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

[data-theme="light"] .title-word[b-7o59k5a1ne] {
    color: #334155;
}

[data-theme="light"] .title-word--highlight[b-7o59k5a1ne] {
    color: #0891b2;
    text-shadow: none;
}

[data-theme="light"] .reward-icon__core[b-7o59k5a1ne] {
    background: rgba(240, 249, 255, 0.95);
    border-color: rgba(0, 150, 200, 0.5);
}

[data-theme="light"] .code-box[b-7o59k5a1ne] {
    background: linear-gradient(135deg,
            rgba(240, 249, 255, 0.95) 0%,
            rgba(224, 242, 254, 0.95) 100%);
}

[data-theme="light"] .code-box__text[b-7o59k5a1ne] {
    color: #0891b2;
}

[data-theme="light"] .copy-btn[b-7o59k5a1ne] {
    background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
    color: #ffffff;
}

[data-theme="light"] .daily-drop-modal__validity[b-7o59k5a1ne] {
    color: #64748b;
}

[data-theme="light"] .validity-icon[b-7o59k5a1ne] {
    color: #64748b;
}

[data-theme="light"] .daily-drop-modal__note[b-7o59k5a1ne] {
    color: #64748b;
}

[data-theme="light"] .countdown-label[b-7o59k5a1ne] {
    color: #64748b;
}

[data-theme="light"] .countdown-time[b-7o59k5a1ne] {
    color: #0891b2;
    text-shadow: none;
}

[data-theme="light"] .daily-drop__hint[b-7o59k5a1ne] {
    color: #0891b2;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Button centering fix */
.daily-drop-modal__result[b-7o59k5a1ne],
.daily-drop-modal__already[b-7o59k5a1ne] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

@media (max-width: 768px) {

    /* MOBILE FIX: Move orb to left side to avoid back-to-top button */
    .daily-drop[b-7o59k5a1ne] {
        bottom: 80px !important;
        right: auto !important;
        left: 10px !important;
        z-index: 100 !important;
    }

    .daily-drop__orb[b-7o59k5a1ne] {
        width: 40px !important;
        height: 40px !important;
    }

    .daily-drop__glow[b-7o59k5a1ne] {
        width: 55px !important;
        height: 55px !important;
    }

    .daily-drop__particles[b-7o59k5a1ne] {
        width: 70px !important;
        height: 70px !important;
    }

    .daily-drop__hint[b-7o59k5a1ne] {
        font-size: 8px !important;
        bottom: -16px !important;
    }
}
/* /Shared/DragThemeSlider.razor.rz.scp.css */
/* ============================================
   Drag Theme Slider (Sun/Moon)
   ============================================ */
.theme-slider[b-mxwm1r9x17] {
    position: relative;
    width: 70px;
    height: 32px;
    cursor: pointer;
    user-select: none;
}

.theme-slider__track[b-mxwm1r9x17] {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 8px;
    transform: translateY(-50%);
    background: linear-gradient(90deg, #fbbf24 0%, #1e3a5f 100%);
    border-radius: 4px;
    overflow: hidden;
}

.theme-slider__fill[b-mxwm1r9x17] {
    height: 100%;
    background: linear-gradient(90deg, #fef3c7 0%, #0f172a 100%);
    transition: width 0.1s ease;
}

.theme-slider__handle[b-mxwm1r9x17] {
    position: absolute;
    top: 50%;
    width: 28px;
    height: 28px;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: left 0.15s ease, box-shadow 0.2s;
    z-index: 1;
}

.theme-slider--dragging .theme-slider__handle[b-mxwm1r9x17] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    transform: translate(-50%, -50%) scale(1.1);
}

.theme-slider__icon[b-mxwm1r9x17] {
    position: absolute;
    font-size: 16px;
    transition: opacity 0.2s, transform 0.2s;
    opacity: 0.3;
    transform: scale(0.8);
}

.theme-slider__icon--active[b-mxwm1r9x17] {
    opacity: 1;
    transform: scale(1);
}

.theme-slider__icon--sun[b-mxwm1r9x17] {
    /* Sun visible in light mode */
    color: #fbbf24;
}

.theme-slider__icon--moon[b-mxwm1r9x17] {
    /* Moon visible in dark mode */
    color: #94a3b8;
}

/* Mobile: Fallback to simple tap */
@media (max-width: 768px) {
    .theme-slider[b-mxwm1r9x17] {
        width: 50px;
        height: 28px;
    }

    .theme-slider__handle[b-mxwm1r9x17] {
        width: 24px;
        height: 24px;
    }

    .theme-slider__icon[b-mxwm1r9x17] {
        font-size: 14px;
    }
}

/* Dark mode adjustments */
[data-theme="dark"] .theme-slider__handle[b-mxwm1r9x17] {
    background: #1e293b;
    border: 1px solid rgba(255, 255, 255, 0.1);
}
/* /Shared/FaqSectionComponent.razor.rz.scp.css */
/* Shared/FaqSectionComponent.razor.css */

.faqs-section[b-0zdocpsu1w] {
    padding: 100px 0;
    /* Even padding top and bottom */
    width: 100%;
}

.faqs-container[b-0zdocpsu1w] {
    max-width: 900px;
    /* Restored narrow width */
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.faqs-main-title[b-0zdocpsu1w] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--color-header);
    margin-bottom: 50px;
    text-align: center;
    line-height: 1.2;
}

.faqs-list[b-0zdocpsu1w] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.faqs-item[b-0zdocpsu1w] {
    background: var(--bg-secondary);
    border-radius: 12px;
    border: 1px solid var(--border-color);
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-sm);
}

.faqs-item:hover[b-0zdocpsu1w] {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(255, 135, 73, 0.15);
    transform: translateY(-2px);
}

.faqs-question[b-0zdocpsu1w] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    background: var(--bg-tertiary);
    border: none;
    text-align: left;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.3s ease;
}

.faqs-question:hover[b-0zdocpsu1w] {
    background: var(--bg-primary);
    color: var(--color-header);
}

.faqs-question span[b-0zdocpsu1w] {
    flex: 1;
    padding-right: 16px;
}

.faqs-question svg[b-0zdocpsu1w] {
    color: var(--text-muted);
    transition: transform 0.3s ease, color 0.3s ease;
    flex-shrink: 0;
}

.faqs-question:hover svg[b-0zdocpsu1w] {
    color: var(--color-primary);
}

.faqs-icon-open[b-0zdocpsu1w] {
    transform: rotate(180deg);
    color: var(--color-primary) !important;
}

.faqs-answer[b-0zdocpsu1w] {
    padding: 20px 24px;
    background: var(--bg-secondary);
    color: var(--text-primary);
    line-height: 1.7;
    animation: slideDown-b-0zdocpsu1w 0.3s ease-out;
    border-top: 1px solid var(--border-color);
}

@keyframes slideDown-b-0zdocpsu1w {
    from {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    to {
        opacity: 1;
        max-height: 500px;
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

.faqs-answer p[b-0zdocpsu1w] {
    margin: 0 0 12px 0;
}

.faqs-answer p:last-child[b-0zdocpsu1w] {
    margin-bottom: 0;
}

.faqs-answer ul[b-0zdocpsu1w] {
    margin: 12px 0;
    padding-left: 24px;
    list-style-type: disc;
}

.faqs-answer li[b-0zdocpsu1w] {
    margin-bottom: 8px;
    line-height: 1.6;
}

.faqs-answer a[b-0zdocpsu1w] {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.faqs-answer a:hover[b-0zdocpsu1w] {
    color: #FF6B2B;
    text-decoration: underline;
}

/* Responsive Design */
@media (max-width: 768px) {
    .faqs-main-title[b-0zdocpsu1w] {
        font-size: 2rem;
        margin-bottom: 30px;
    }

    .faqs-question[b-0zdocpsu1w] {
        padding: 16px 20px;
        font-size: 1rem;
    }

    .faqs-answer[b-0zdocpsu1w] {
        padding: 16px 20px;
    }
}
/* /Shared/FirstWinPopupComponent.razor.rz.scp.css */
/* First Win Popup Styles - Hextech Theme */
.first-win-overlay[b-oogakkcx57] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(10, 10, 15, 0.85);
    backdrop-filter: blur(8px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-oogakkcx57 0.4s ease-out;
}

@keyframes fadeIn-b-oogakkcx57 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.first-win-container[b-oogakkcx57] {
    width: 90%;
    max-width: 500px;
    background: #091428;
    border: 2px solid #C8AA6E;
    box-shadow: 0 0 30px rgba(200, 170, 110, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.8);
    position: relative;
    padding-bottom: 30px;
    transform: translateY(20px);
    animation: slideUp-b-oogakkcx57 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

@keyframes slideUp-b-oogakkcx57 {
    to {
        transform: translateY(0);
    }
}

/* Decorative Corners */
.first-win-container[b-oogakkcx57]::before,
.first-win-container[b-oogakkcx57]::after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border: 2px solid #C8AA6E;
    transition: all 0.3s;
}

.first-win-container[b-oogakkcx57]::before {
    top: -2px;
    left: -2px;
    border-bottom: 0;
    border-right: 0;
}

.first-win-container[b-oogakkcx57]::after {
    bottom: -2px;
    right: -2px;
    border-top: 0;
    border-left: 0;
}

.first-win-header[b-oogakkcx57] {
    background: linear-gradient(90deg, transparent, rgba(200, 170, 110, 0.2), transparent);
    padding: 15px 0;
    text-align: center;
    border-bottom: 1px solid rgba(200, 170, 110, 0.3);
    margin-bottom: 30px;
}

.first-win-title[b-oogakkcx57] {
    color: #F0E6D2;
    font-family: serif;
    /* Use specialized LoL font if available, else serif handles the 'classic' look well */
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 1.2rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
}

.first-win-content[b-oogakkcx57] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 30px;
}

.first-win-icon[b-oogakkcx57] {
    position: relative;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.fw-circle-outer[b-oogakkcx57] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #C8AA6E;
    border-radius: 50%;
    animation: spinSlow-b-oogakkcx57 10s linear infinite;
    border-top-color: transparent;
    border-bottom-color: transparent;
}

.fw-circle-inner[b-oogakkcx57] {
    width: 80px;
    height: 80px;
    background: radial-gradient(circle, #1E2328 0%, #0A0A0C 100%);
    border: 1px solid #C8AA6E;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 15px rgba(200, 170, 110, 0.4);
}

.fw-icon[b-oogakkcx57] {
    font-size: 40px;
    filter: drop-shadow(0 0 10px #C8AA6E);
    animation: pulse-b-oogakkcx57 2s infinite;
}

.first-win-mission-name[b-oogakkcx57] {
    color: #F0E6D2;
    text-transform: uppercase;
    font-size: 1.8rem;
    font-weight: 800;
    margin: 0 0 10px 0;
    letter-spacing: 1px;
    text-align: center;
    background: linear-gradient(180deg, #F0E6D2 0%, #C8AA6E 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.first-win-rewards[b-oogakkcx57] {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    font-size: 0.9rem;
    color: #A09B8C;
}

.reward-value[b-oogakkcx57] {
    color: #0AC8B9;
    /* Hextech Blue */
    font-weight: 700;
    text-shadow: 0 0 10px rgba(10, 200, 185, 0.5);
}

.first-win-code-display[b-oogakkcx57] {
    background: rgba(0, 0, 0, 0.5);
    border: 1px dashed #C8AA6E;
    color: #F0E6D2;
    padding: 10px 30px;
    font-family: monospace;
    font-size: 1.5rem;
    letter-spacing: 2px;
    margin-bottom: 30px;
    border-radius: 4px;
}

/* Hextech Buttons */
.first-win-actions[b-oogakkcx57] {
    display: flex;
    gap: 15px;
    width: 100%;
}

.hex-btn[b-oogakkcx57] {
    flex: 1;
    padding: 15px;
    border: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    /* geometric clip path if supported, else simplistic */
}

.hex-btn.primary[b-oogakkcx57] {
    background: #1E2328;
    color: #C8AA6E;
    border: 1px solid #C8AA6E;
    box-shadow: 0 0 10px rgba(200, 170, 110, 0.1);
}

.hex-btn.primary:hover[b-oogakkcx57] {
    background: #C8AA6E;
    color: #091428;
    box-shadow: 0 0 20px rgba(200, 170, 110, 0.6);
}

.hex-btn.secondary[b-oogakkcx57] {
    background: transparent;
    color: #A09B8C;
    border: 1px solid #5C5B57;
}

.hex-btn.secondary:hover[b-oogakkcx57] {
    border-color: #C8AA6E;
    color: #F0E6D2;
}

@keyframes spinSlow-b-oogakkcx57 {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulse-b-oogakkcx57 {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}
/* /Shared/LazyComponent.razor.rz.scp.css */
/* LazyComponent.razor.css - Scoped styles for Lazy Component loader */

.lazy-loading[b-3pmho7axq7] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    padding: 20px;
}
/* /Shared/LoadingSkeleton.razor.rz.scp.css */
/* LoadingSkeleton.razor.css - Scoped styles for Loading Skeleton component */

.skeleton-container[b-7ozqwd7cwy] {
    display: inline-block;
}

.skeleton[b-7ozqwd7cwy] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading-b-7ozqwd7cwy 1.5s ease-in-out infinite;
    border-radius: 4px;
}

.skeleton--text[b-7ozqwd7cwy] {
    border-radius: 4px;
}

.skeleton--circle[b-7ozqwd7cwy] {
    border-radius: 50%;
}

.skeleton-card[b-7ozqwd7cwy] {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.skeleton-card__content[b-7ozqwd7cwy] {
    padding: 16px;
}

.skeleton--image[b-7ozqwd7cwy] {
    border-radius: 0;
}

@keyframes loading-b-7ozqwd7cwy {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
.header-actions[b-vhakpnurtv] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-mobile-currency[b-vhakpnurtv] {
    display: none;
}

.mobile-currency-select[b-vhakpnurtv] {
    display: none;
}

@media only screen and (max-width: 480px) {
    .header-mobile-currency[b-vhakpnurtv] {
        display: block;
    }

    .mobile-currency-select[b-vhakpnurtv] {
        display: block;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background: #FFFFFF;
        border: 2px solid #C1E1E0;
        border-radius: 8px;
        padding: 10px 32px 10px 12px;
        font-size: 14px;
        font-weight: 500;
        color: #2f3238;
        cursor: pointer;
        min-height: 44px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%232f3238' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 10px center;
        background-size: 12px;
        font-family: 'Montserrat', sans-serif;
    }

    .mobile-currency-select:focus[b-vhakpnurtv] {
        outline: none;
        border-color: var(--color-primary);
    }

    .header-links .header-currency-picker[b-vhakpnurtv] {
        display: none !important;
    }
}

/* Mobile Theme Toggle */
.mobile-theme-toggle[b-vhakpnurtv] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 8px;
    border: 2px solid #C1E1E0;
    background: #FFFFFF;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
}

.mobile-theme-toggle:hover[b-vhakpnurtv] {
    border-color: var(--color-primary);
}

@media only screen and (max-width: 480px) {
    .mobile-theme-toggle[b-vhakpnurtv] {
        display: flex;
    }
}

/* Dark Mode Overrides for Navigation */
[data-theme="dark"] .logo svg *[fill="#434850"][b-vhakpnurtv] {
    fill: #FFFFFF !important;
}

[data-theme="dark"] .logo svg *[fill="#040200"][b-vhakpnurtv] {
    fill: #FFFFFF !important;
    opacity: 0.4 !important;
}

[data-theme="dark"] .currency-picker__trigger[b-vhakpnurtv] {
    background: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    border: 2px solid var(--border-color) !important;
}

[data-theme="dark"] .currency-picker__list[b-vhakpnurtv] {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .currency-picker__option:hover[b-vhakpnurtv] {
    background: var(--bg-tertiary) !important;
}

[data-theme="dark"] .mobile-currency-select[b-vhakpnurtv],
[data-theme="dark"] .mobile-theme-toggle[b-vhakpnurtv] {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: #FFFFFF !important;
}

/* Nav Highlight for BE Calculator */
.nav-highlight[b-vhakpnurtv] {
    position: relative;
    color: #0CD9D9 !important;
    font-weight: 600 !important;
}

.nav-highlight[b-vhakpnurtv]::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, #0CD9D9, transparent);
    border-radius: 2px;
}

.nav-highlight:hover[b-vhakpnurtv] {
    color: #fff !important;
}
/* /Shared/PingTester.razor.rz.scp.css */
.ping-tester[b-dzca00wf4k] {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.ping-controls[b-dzca00wf4k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.test-btn[b-dzca00wf4k] {
    background: var(--bg-primary);
    border: 2px solid var(--color-primary);
    color: var(--color-primary);
    border-radius: 12px;
    padding: 12px 24px;
    font-weight: 800;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.85rem;
}

.test-btn:hover:not(:disabled)[b-dzca00wf4k] {
    background: var(--color-primary);
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(255, 135, 73, 0.3);
}

.test-btn:disabled[b-dzca00wf4k] {
    opacity: 0.5;
    border-color: var(--text-muted);
    color: var(--text-muted);
}

.refresh-svg[b-dzca00wf4k] {
    width: 18px;
    height: 18px;
}

.best-region-badge[b-dzca00wf4k] {
    padding: 10px 20px;
    border-radius: 12px;
    font-size: 0.9rem;
    display: flex;
    gap: 8px;
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.best-region-badge .label[b-dzca00wf4k] {
    color: var(--text-muted);
    font-weight: 600;
}

.best-region-badge .value[b-dzca00wf4k] {
    color: var(--color-success);
    font-weight: 800;
    text-shadow: 0 0 10px rgba(34, 197, 94, 0.2);
}

.server-grid[b-dzca00wf4k] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.server-card[b-dzca00wf4k] {
    padding: 16px 20px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.server-card:hover[b-dzca00wf4k] {
    background: var(--bg-tertiary);
    border-color: var(--border-light);
}

.server-card.is-best[b-dzca00wf4k] {
    background: var(--bg-tertiary);
    border-color: var(--color-success);
    box-shadow: 0 0 20px rgba(34, 197, 94, 0.05);
}

.server-card.is-best[b-dzca00wf4k]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: var(--color-success);
    box-shadow: 0 0 10px var(--color-success);
}

.server-info[b-dzca00wf4k] {
    display: flex;
    flex-direction: column;
    min-width: 160px;
}

.name-row[b-dzca00wf4k] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.server-name[b-dzca00wf4k] {
    font-weight: 800;
    color: var(--text-secondary);
    font-size: 1.05rem;
}

.best-badge[b-dzca00wf4k] {
    background: rgba(34, 197, 94, 0.1);
    color: var(--color-success);
    font-size: 0.65rem;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 0.5px;
    border: 1px solid rgba(34, 197, 94, 0.2);
    animation: glow-pulse-b-dzca00wf4k 2s infinite;
}

@keyframes glow-pulse-b-dzca00wf4k {
    0% {
        box-shadow: 0 0 5px rgba(34, 197, 94, 0.1);
    }

    50% {
        box-shadow: 0 0 15px rgba(34, 197, 94, 0.4);
    }

    100% {
        box-shadow: 0 0 5px rgba(34, 197, 94, 0.1);
    }
}

.server-code[b-dzca00wf4k] {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 700;
    text-transform: uppercase;
}

.ping-visual[b-dzca00wf4k] {
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: flex-end;
}

.ping-bar-bg[b-dzca00wf4k] {
    flex-grow: 1;
    height: 8px;
    background: var(--border-light);
    border-radius: 4px;
    overflow: hidden;
    max-width: 140px;
}

.ping-bar[b-dzca00wf4k] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s ease;
}

.ping-stats[b-dzca00wf4k] {
    min-width: 100px;
    text-align: center;
    padding: 6px 12px;
    border-radius: 8px;
    background: var(--bg-tertiary);
    transition: all 0.3s ease;
    border: 1px solid var(--border-color);
}

.ping-ms[b-dzca00wf4k] {
    color: var(--text-primary);
    font-family: 'JetBrains Mono', 'Courier New', monospace;
    font-size: 1rem;
    font-weight: 900;
}

/* Status Conditionals - High Contrast Overrides */
.ping-stats:has(.ping-good)[b-dzca00wf4k] {
    background-color: var(--color-success) !important;
    border-color: var(--color-success) !important;
}

.ping-stats:has(.ping-medium)[b-dzca00wf4k] {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.ping-stats:has(.ping-poor)[b-dzca00wf4k] {
    background-color: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
}

/* Force white text on status backgrounds for visibility */
.ping-stats:has(.ping-good) .ping-ms[b-dzca00wf4k],
.ping-stats:has(.ping-medium) .ping-ms[b-dzca00wf4k],
.ping-stats:has(.ping-poor) .ping-ms[b-dzca00wf4k] {
    color: white !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.ping-bar.ping-good[b-dzca00wf4k] {
    background-color: var(--color-success);
}

.ping-bar.ping-medium[b-dzca00wf4k] {
    background-color: var(--color-primary);
}

.ping-bar.ping-poor[b-dzca00wf4k] {
    background-color: var(--color-danger);
}

.ping-none[b-dzca00wf4k] {
    background-color: var(--border-light);
    color: var(--text-muted);
}

.spinner[b-dzca00wf4k] {
    width: 20px;
    height: 20px;
    border: 3px solid rgba(255, 135, 73, 0.2);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin-b-dzca00wf4k 0.8s linear infinite;
}

@keyframes spin-b-dzca00wf4k {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 600px) {
    .ping-controls[b-dzca00wf4k] {
        flex-direction: column;
        align-items: stretch;
    }

    .ping-bar-bg[b-dzca00wf4k] {
        display: none;
    }

    .ping-stats[b-dzca00wf4k] {
        min-width: 80px;
    }
}
/* /Shared/PopularityWidgetComponent.razor.rz.scp.css */
/* PopularityWidgetComponent.razor.css - Scoped styles for Popularity Widget */

.popularity-widget[b-ce86srs3cl] {
    padding: 20px;
    background: linear-gradient(135deg, #F5F5F5 0%, #E6F4F1 100%);
    border: 1px solid #E6F4F1;
    border-radius: 8px;
    margin: 20px 0;
    font-family: 'Montserrat', sans-serif;
}

.popularity-widget__title[b-ce86srs3cl] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2F3238;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
}

.popularity-widget__stats[b-ce86srs3cl] {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 12px;
}

.popularity-stat[b-ce86srs3cl] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.popularity-stat.--highlight[b-ce86srs3cl] {
    padding: 6px 12px;
    background: rgba(12, 217, 217, 0.1);
    border: 1px solid rgba(12, 217, 217, 0.3);
    border-radius: 6px;
}

.popularity-stat__value[b-ce86srs3cl] {
    font-size: 1rem;
    font-weight: 700;
    color: #2F3238;
}

.popularity-stat__label[b-ce86srs3cl] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #666666;
}

.popularity-stat__badge[b-ce86srs3cl] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #0CD9D9;
}

.popularity-widget__trending[b-ce86srs3cl] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.popularity-widget__trend-icon[b-ce86srs3cl] {
    font-size: 1rem;
    animation: bounce-b-ce86srs3cl 2s ease-in-out infinite;
}

@keyframes bounce-b-ce86srs3cl {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }
}

.popularity-widget__trending small[b-ce86srs3cl] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #FF8749;
}

@media only screen and (max-width: 576px) {
    .popularity-widget__stats[b-ce86srs3cl] {
        flex-wrap: wrap;
        gap: 12px;
    }
}
/* /Shared/RelatedPostsComponent.razor.rz.scp.css */
/* RelatedPostsComponent.razor.css - Scoped styles for Related Posts */

.related-posts__card:hover[b-a105xhfzsj] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.related-posts__card:hover .related-posts__image img[b-a105xhfzsj] {
    transform: scale(1.05);
}

.related-posts__card-title:hover[b-a105xhfzsj] {
    color: var(--color-primary);
}

/* Dark mode styles */
[b-a105xhfzsj] [data-theme="dark"] .related-posts {
    border-top-color: var(--border-color) !important;
}

[b-a105xhfzsj] [data-theme="dark"] .related-posts__card {
    background: var(--bg-secondary) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

[b-a105xhfzsj] [data-theme="dark"] .related-posts__excerpt {
    color: var(--text-muted) !important;
}

[b-a105xhfzsj] [data-theme="dark"] .related-posts__date {
    color: rgba(255, 255, 255, 0.4) !important;
}
/* /Shared/Season16BannerComponent.razor.rz.scp.css */
/* Season 16 Hero Banner - Theme Aware */

.s16-hero-banner[b-ajgdvkjj6m] {
    position: relative;
    padding: 60px 20px;
    overflow: hidden;
    margin-bottom: 0;
}

/* Light Mode Base */
.s16-hero-banner[b-ajgdvkjj6m] {
    background: linear-gradient(135deg, #f0fafa 0%, #f5f0ff 50%, #fafafa 100%);
}

/* Dark Mode Base */
[data-theme="dark"] .s16-hero-banner[b-ajgdvkjj6m] {
    background: linear-gradient(135deg, #0a1a1a 0%, #0f0a1a 50%, #0f1115 100%);
}

/* ============================================
   AURORA BACKGROUND LAYERS
   ============================================ */
.s16-hero-banner__aurora[b-ajgdvkjj6m] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
}

.aurora-layer[b-ajgdvkjj6m] {
    position: absolute;
    width: 200%;
    height: 200%;
    opacity: 0.4;
    filter: blur(80px);
}

/* Light Mode Aurora */
.aurora-layer--1[b-ajgdvkjj6m] {
    top: -50%;
    left: -50%;
    background: radial-gradient(ellipse at center, rgba(34, 234, 234, 0.3) 0%, transparent 70%);
    animation: aurora-drift-1-b-ajgdvkjj6m 20s ease-in-out infinite;
}

.aurora-layer--2[b-ajgdvkjj6m] {
    top: -30%;
    right: -50%;
    background: radial-gradient(ellipse at center, rgba(167, 139, 250, 0.3) 0%, transparent 70%);
    animation: aurora-drift-2-b-ajgdvkjj6m 25s ease-in-out infinite;
}

.aurora-layer--3[b-ajgdvkjj6m] {
    bottom: -40%;
    left: -30%;
    background: radial-gradient(ellipse at center, rgba(255, 135, 73, 0.2) 0%, transparent 70%);
    animation: aurora-drift-3-b-ajgdvkjj6m 30s ease-in-out infinite;
}

/* Dark Mode Aurora - More vibrant */
[data-theme="dark"] .aurora-layer--1[b-ajgdvkjj6m] {
    background: radial-gradient(ellipse at center, rgba(34, 234, 234, 0.4) 0%, transparent 70%);
    opacity: 0.6;
}

[data-theme="dark"] .aurora-layer--2[b-ajgdvkjj6m] {
    background: radial-gradient(ellipse at center, rgba(167, 139, 250, 0.4) 0%, transparent 70%);
    opacity: 0.6;
}

[data-theme="dark"] .aurora-layer--3[b-ajgdvkjj6m] {
    background: radial-gradient(ellipse at center, rgba(255, 135, 73, 0.3) 0%, transparent 70%);
    opacity: 0.5;
}

@keyframes aurora-drift-1-b-ajgdvkjj6m {

    0%,
    100% {
        transform: translate(0, 0) rotate(0deg);
    }

    33% {
        transform: translate(10%, 5%) rotate(5deg);
    }

    66% {
        transform: translate(-5%, 10%) rotate(-3deg);
    }
}

@keyframes aurora-drift-2-b-ajgdvkjj6m {

    0%,
    100% {
        transform: translate(0, 0) rotate(0deg);
    }

    33% {
        transform: translate(-15%, 8%) rotate(-8deg);
    }

    66% {
        transform: translate(8%, -5%) rotate(5deg);
    }
}

@keyframes aurora-drift-3-b-ajgdvkjj6m {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(5%, -10%) scale(1.1);
    }
}

/* ============================================
   FLOATING PARTICLES
   ============================================ */
.s16-hero-banner__particles[b-ajgdvkjj6m] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    overflow: hidden;
}

.particle[b-ajgdvkjj6m] {
    position: absolute;
    width: 4px;
    height: 4px;
    background: rgba(34, 234, 234, 0.6);
    border-radius: 50%;
    left: var(--x);
    bottom: -10px;
    animation: particle-float-b-ajgdvkjj6m var(--duration) ease-in-out infinite;
    animation-delay: var(--delay);
    box-shadow: 0 0 10px rgba(34, 234, 234, 0.4);
}

.particle:nth-child(even)[b-ajgdvkjj6m] {
    background: rgba(167, 139, 250, 0.6);
    box-shadow: 0 0 10px rgba(167, 139, 250, 0.4);
    width: 3px;
    height: 3px;
}

@keyframes particle-float-b-ajgdvkjj6m {
    0% {
        transform: translateY(0) translateX(0) scale(1);
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        transform: translateY(-100vh) translateX(50px) scale(0.5);
        opacity: 0;
    }
}

/* ============================================
   CONTENT
   ============================================ */
.s16-hero-banner__content[b-ajgdvkjj6m] {
    position: relative;
    z-index: 10;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Badge */
.s16-hero-banner__badge[b-ajgdvkjj6m] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.15) 0%, rgba(167, 139, 250, 0.15) 100%);
    border: 1px solid rgba(34, 234, 234, 0.3);
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--text-secondary);
    margin-bottom: 20px;
}

[data-theme="dark"] .s16-hero-banner__badge[b-ajgdvkjj6m] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.2) 0%, rgba(167, 139, 250, 0.2) 100%);
    color: #fff;
}

.badge-pulse[b-ajgdvkjj6m] {
    width: 8px;
    height: 8px;
    background: #22EAEA;
    border-radius: 50%;
    animation: pulse-badge-b-ajgdvkjj6m 2s ease-in-out infinite;
    box-shadow: 0 0 10px #22EAEA;
}

@keyframes pulse-badge-b-ajgdvkjj6m {

    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.5);
        opacity: 0.5;
    }
}

/* Title with Glitch Effect */
.s16-hero-banner__title[b-ajgdvkjj6m] {
    font-size: clamp(2rem, 6vw, 3.5rem);
    font-weight: 900;
    letter-spacing: 4px;
    margin: 0 0 16px 0;
    line-height: 1.1;
}

.s16-glitch-text[b-ajgdvkjj6m] {
    position: relative;
    display: inline-block;
    background: linear-gradient(90deg, #22EAEA 0%, #A78BFA 50%, #FF8749 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradient-wave-b-ajgdvkjj6m 4s ease-in-out infinite;
}

@keyframes gradient-wave-b-ajgdvkjj6m {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

.s16-glitch-text[b-ajgdvkjj6m]::before,
.s16-glitch-text[b-ajgdvkjj6m]::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.8;
}

.s16-glitch-text[b-ajgdvkjj6m]::before {
    animation: glitch-shift-1-b-ajgdvkjj6m 3s infinite linear alternate-reverse;
    clip-path: polygon(0 0, 100% 0, 100% 40%, 0 40%);
}

.s16-glitch-text[b-ajgdvkjj6m]::after {
    animation: glitch-shift-2-b-ajgdvkjj6m 4s infinite linear alternate-reverse;
    clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0 100%);
}

@keyframes glitch-shift-1-b-ajgdvkjj6m {

    0%,
    100% {
        transform: translateX(0);
    }

    20% {
        transform: translateX(-3px);
    }

    40% {
        transform: translateX(3px);
    }

    60% {
        transform: translateX(-2px);
    }

    80% {
        transform: translateX(2px);
    }
}

@keyframes glitch-shift-2-b-ajgdvkjj6m {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(3px);
    }

    50% {
        transform: translateX(-3px);
    }

    75% {
        transform: translateX(1px);
    }
}

/* Subtitle */
.s16-hero-banner__subtitle[b-ajgdvkjj6m] {
    font-size: 1.1rem;
    color: var(--text-primary);
    margin: 0 0 30px 0;
    opacity: 0.9;
}

[data-theme="dark"] .s16-hero-banner__subtitle[b-ajgdvkjj6m] {
    color: rgba(255, 255, 255, 0.8);
}

/* ============================================
   PROMO CODE SECTION
   ============================================ */
.s16-hero-banner__promo[b-ajgdvkjj6m] {
    position: relative;
    margin-bottom: 30px;
}

.s16-promo-code[b-ajgdvkjj6m] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.s16-promo-code__label[b-ajgdvkjj6m] {
    font-size: 0.85rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.s16-promo-code__value[b-ajgdvkjj6m] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 28px;
    background: var(--bg-secondary);
    border: 2px dashed rgba(34, 234, 234, 0.5);
    border-radius: 12px;
    font-size: 1.5rem;
    font-weight: 800;
    font-family: 'Courier New', monospace;
    letter-spacing: 4px;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

[data-theme="dark"] .s16-promo-code__value[b-ajgdvkjj6m] {
    background: rgba(26, 29, 36, 0.8);
    border-color: rgba(34, 234, 234, 0.6);
    color: #22EAEA;
}

.s16-promo-code__value:hover[b-ajgdvkjj6m] {
    border-style: solid;
    transform: scale(1.02);
    box-shadow: 0 0 30px rgba(34, 234, 234, 0.3);
}

.s16-promo-code__value[b-ajgdvkjj6m]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(34, 234, 234, 0.2), transparent);
    animation: shimmer-b-ajgdvkjj6m 3s infinite;
}

@keyframes shimmer-b-ajgdvkjj6m {
    0% {
        left: -100%;
    }

    100% {
        left: 100%;
    }
}

.s16-promo-code__copy[b-ajgdvkjj6m] {
    width: 20px;
    height: 20px;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.s16-promo-code__value:hover .s16-promo-code__copy[b-ajgdvkjj6m] {
    opacity: 1;
}

.s16-promo-code__discount[b-ajgdvkjj6m] {
    font-size: 1rem;
    font-weight: 700;
    background: linear-gradient(90deg, #22EAEA, #A78BFA);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Copied Toast */
.s16-copied-toast[b-ajgdvkjj6m] {
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    background: #22EAEA;
    color: #000;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    animation: toast-pop-b-ajgdvkjj6m 0.3s ease-out;
    box-shadow: 0 4px 15px rgba(34, 234, 234, 0.4);
}

@keyframes toast-pop-b-ajgdvkjj6m {
    0% {
        transform: translateX(-50%) translateY(10px) scale(0.8);
        opacity: 0;
    }

    100% {
        transform: translateX(-50%) translateY(0) scale(1);
        opacity: 1;
    }
}

/* ============================================
   BUTTONS
   ============================================ */
.s16-hero-banner__actions[b-ajgdvkjj6m] {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

.s16-btn[b-ajgdvkjj6m] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

.s16-btn svg[b-ajgdvkjj6m] {
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease;
}

.s16-btn--primary[b-ajgdvkjj6m] {
    background: linear-gradient(135deg, #22EAEA 0%, #A78BFA 100%);
    color: #000 !important;
    box-shadow: 0 4px 20px rgba(34, 234, 234, 0.4);
}

.s16-btn--primary:hover[b-ajgdvkjj6m] {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(34, 234, 234, 0.5);
    color: #000 !important;
}

.s16-btn--primary:hover svg[b-ajgdvkjj6m] {
    transform: translateX(4px);
}

.s16-btn--secondary[b-ajgdvkjj6m] {
    background: transparent;
    color: var(--text-secondary) !important;
    border: 2px solid rgba(167, 139, 250, 0.5);
}

[data-theme="dark"] .s16-btn--secondary[b-ajgdvkjj6m] {
    color: #fff !important;
    border-color: rgba(167, 139, 250, 0.6);
}

.s16-btn--secondary:hover[b-ajgdvkjj6m] {
    background: rgba(167, 139, 250, 0.1);
    border-color: #A78BFA;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .s16-btn--secondary:hover[b-ajgdvkjj6m] {
    color: #fff !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    .s16-hero-banner[b-ajgdvkjj6m] {
        padding: 40px 15px;
    }

    .s16-hero-banner__title[b-ajgdvkjj6m] {
        font-size: 1.8rem;
        letter-spacing: 2px;
    }

    .s16-hero-banner__subtitle[b-ajgdvkjj6m] {
        font-size: 0.95rem;
    }

    .s16-promo-code__value[b-ajgdvkjj6m] {
        font-size: 1.2rem;
        padding: 12px 20px;
        letter-spacing: 3px;
    }

    .s16-btn[b-ajgdvkjj6m] {
        padding: 12px 20px;
        font-size: 0.9rem;
    }

    .s16-hero-banner__actions[b-ajgdvkjj6m] {
        flex-direction: column;
        align-items: center;
    }
}
/* /Shared/Season16CountdownComponent.razor.rz.scp.css */
/* Season 16 Countdown Component - Theme Aware */

.s16-countdown[b-zbf9b3pzy8] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.1) 0%, rgba(167, 139, 250, 0.1) 100%);
    border-bottom: 1px solid rgba(34, 234, 234, 0.2);
    padding: 12px 20px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* Light Mode */
.s16-countdown[b-zbf9b3pzy8] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.08) 0%, rgba(167, 139, 250, 0.08) 100%);
}

/* Dark Mode */
[data-theme="dark"] .s16-countdown[b-zbf9b3pzy8] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.15) 0%, rgba(167, 139, 250, 0.15) 100%);
    border-bottom: 1px solid rgba(34, 234, 234, 0.3);
}

/* Aurora effect background animation */
.s16-countdown[b-zbf9b3pzy8]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 300%;
    height: 100%;
    background: linear-gradient(90deg,
            transparent 0%,
            rgba(34, 234, 234, 0.1) 25%,
            rgba(167, 139, 250, 0.1) 50%,
            rgba(34, 234, 234, 0.1) 75%,
            transparent 100%);
    animation: aurora-sweep-b-zbf9b3pzy8 8s linear infinite;
    pointer-events: none;
}

@keyframes aurora-sweep-b-zbf9b3pzy8 {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(33.33%);
    }
}

.s16-countdown__content[b-zbf9b3pzy8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}

.s16-countdown__label[b-zbf9b3pzy8] {
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--text-secondary);
    background: linear-gradient(90deg, #22EAEA, #A78BFA);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.s16-countdown__timer[b-zbf9b3pzy8] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.s16-countdown__unit[b-zbf9b3pzy8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 48px;
}

.s16-countdown__value[b-zbf9b3pzy8] {
    font-size: 1.5rem;
    font-weight: 800;
    font-family: 'Inter', 'Segoe UI', -apple-system, sans-serif;
    color: var(--text-secondary);
    line-height: 1;
    text-shadow: 0 0 20px rgba(34, 234, 234, 0.3);
}

[data-theme="dark"] .s16-countdown__value[b-zbf9b3pzy8] {
    color: #fff;
    text-shadow: 0 0 25px rgba(34, 234, 234, 0.5);
}

.s16-countdown__unit-label[b-zbf9b3pzy8] {
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-muted);
    text-transform: uppercase;
    margin-top: 2px;
}

.s16-countdown__separator[b-zbf9b3pzy8] {
    font-size: 1.5rem;
    font-weight: 300;
    color: var(--text-muted);
    opacity: 0.5;
    animation: pulse-separator-b-zbf9b3pzy8 1s ease-in-out infinite;
}

@keyframes pulse-separator-b-zbf9b3pzy8 {

    0%,
    100% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }
}

/* Launched State */
.s16-countdown--launched[b-zbf9b3pzy8] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.2) 0%, rgba(167, 139, 250, 0.2) 100%);
}

[data-theme="dark"] .s16-countdown--launched[b-zbf9b3pzy8] {
    background: linear-gradient(135deg, rgba(34, 234, 234, 0.25) 0%, rgba(167, 139, 250, 0.25) 100%);
}

.s16-countdown__launched-text[b-zbf9b3pzy8] {
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: 3px;
}

.s16-countdown__cta[b-zbf9b3pzy8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: linear-gradient(135deg, #22EAEA 0%, #A78BFA 100%);
    color: #000 !important;
    font-size: 0.85rem;
    font-weight: 700;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(34, 234, 234, 0.3);
}

.s16-countdown__cta:hover[b-zbf9b3pzy8] {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(34, 234, 234, 0.4);
    color: #000 !important;
}

/* Glitch Effect for "SEASON 16 IS LIVE!" */
.s16-glitch[b-zbf9b3pzy8] {
    position: relative;
    display: inline-block;
    background: linear-gradient(90deg, #22EAEA, #A78BFA, #22EAEA);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradient-shift-b-zbf9b3pzy8 3s ease-in-out infinite;
}

@keyframes gradient-shift-b-zbf9b3pzy8 {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

.s16-glitch[b-zbf9b3pzy8]::before,
.s16-glitch[b-zbf9b3pzy8]::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.s16-glitch[b-zbf9b3pzy8]::before {
    animation: glitch-1-b-zbf9b3pzy8 2s infinite linear alternate-reverse;
    clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%);
}

.s16-glitch[b-zbf9b3pzy8]::after {
    animation: glitch-2-b-zbf9b3pzy8 3s infinite linear alternate-reverse;
    clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%);
}

@keyframes glitch-1-b-zbf9b3pzy8 {

    0%,
    100% {
        transform: translateX(0);
    }

    20% {
        transform: translateX(-2px);
    }

    40% {
        transform: translateX(2px);
    }

    60% {
        transform: translateX(-1px);
    }

    80% {
        transform: translateX(1px);
    }
}

@keyframes glitch-2-b-zbf9b3pzy8 {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(2px);
    }

    50% {
        transform: translateX(-2px);
    }

    75% {
        transform: translateX(1px);
    }
}

/* Mobile Responsive */
@media (max-width: 600px) {
    .s16-countdown[b-zbf9b3pzy8] {
        padding: 10px 15px;
    }

    .s16-countdown__content[b-zbf9b3pzy8] {
        gap: 10px;
    }

    .s16-countdown__label[b-zbf9b3pzy8] {
        font-size: 0.7rem;
        letter-spacing: 1px;
    }

    .s16-countdown__value[b-zbf9b3pzy8] {
        font-size: 1.2rem;
    }

    .s16-countdown__unit[b-zbf9b3pzy8] {
        min-width: 36px;
    }

    .s16-countdown__unit-label[b-zbf9b3pzy8] {
        font-size: 0.5rem;
    }

    .s16-countdown__cta[b-zbf9b3pzy8] {
        font-size: 0.75rem;
        padding: 6px 12px;
    }
}
/* /Shared/Skeleton.razor.rz.scp.css */
.skeleton[b-swi50z09ri] {
    background-color: rgba(0, 0, 0, 0.11);
    border-radius: 4px;
    animation: skeleton-pulse-b-swi50z09ri 1.5s ease-in-out 0.5s infinite;
}

/* Dark Mode Support */
[data-theme="dark"] .skeleton[b-swi50z09ri] {
    background-color: rgba(255, 255, 255, 0.1);
}

@keyframes skeleton-pulse-b-swi50z09ri {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.4;
    }

    100% {
        opacity: 1;
    }
}
/* /Shared/SmurfNameGenerator.razor.rz.scp.css */
.name-generator[b-6qrgxttpjt] {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.gen-input-group[b-6qrgxttpjt] {
    display: flex;
    gap: 15px;
}

.input-wrapper[b-6qrgxttpjt] {
    position: relative;
    flex-grow: 1;
}

.gen-input[b-6qrgxttpjt] {
    width: 100%;
    background: var(--bg-tertiary);
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 14px 20px;
    color: var(--text-secondary);
    font-size: 1.1rem;
    font-weight: 600;
    transition: all 0.3s ease;
    outline: none;
}

.gen-input[b-6qrgxttpjt]::placeholder {
    color: var(--text-muted);
    font-weight: 400;
}

.gen-input:focus[b-6qrgxttpjt] {
    border-color: var(--color-primary);
    background: var(--bg-secondary);
    box-shadow: 0 0 20px rgba(255, 135, 73, 0.15);
}

.input-glow[b-6qrgxttpjt] {
    position: absolute;
    inset: -2px;
    border-radius: 12px;
    background: linear-gradient(90deg, #ff8749, #c850c0);
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s ease;
    filter: blur(8px);
}

.gen-input:focus~.input-glow[b-6qrgxttpjt] {
    opacity: 0.3;
}

.gen-btn[b-6qrgxttpjt] {
    background: linear-gradient(135deg, #ff8749 0%, #c850c0 100%);
    background-size: 200% auto;
    color: white;
    border: none;
    border-radius: 12px;
    padding: 0 30px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.4s ease;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.gen-btn:hover:not(:disabled)[b-6qrgxttpjt] {
    background-position: right center;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(255, 135, 73, 0.4);
}

.gen-results[b-6qrgxttpjt] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 15px;
}

.name-item[b-6qrgxttpjt] {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.3s ease;
}

.name-item:hover[b-6qrgxttpjt] {
    background: var(--bg-tertiary);
    border-color: var(--color-primary);
    transform: scale(1.03);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.name-text-wrapper[b-6qrgxttpjt] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
}

.name-text[b-6qrgxttpjt] {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    color: var(--text-secondary);
    font-size: 1.1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.name-length[b-6qrgxttpjt] {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 800;
}

.name-length.too-long[b-6qrgxttpjt] {
    color: var(--color-danger);
}

.copy-icon-btn[b-6qrgxttpjt] {
    background: transparent;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: 8px;
    border-radius: 8px;
    transition: all 0.2s ease;
    position: relative;
    display: flex;
}

.copy-icon-btn:hover[b-6qrgxttpjt] {
    color: var(--color-primary);
    background: rgba(255, 135, 73, 0.1);
}

.copy-svg[b-6qrgxttpjt] {
    width: 20px;
    height: 20px;
}

.copy-success-hint[b-6qrgxttpjt] {
    position: absolute;
    bottom: 110%;
    right: 0;
    background: var(--color-success);
    color: white;
    font-size: 0.7rem;
    padding: 3px 8px;
    border-radius: 6px;
    font-weight: 800;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transform: translateY(10px) scale(0.8);
}

.copy-icon-btn:active .copy-success-hint[b-6qrgxttpjt] {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.spinner[b-6qrgxttpjt] {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-6qrgxttpjt 0.8s linear infinite;
}

@keyframes spin-b-6qrgxttpjt {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 480px) {
    .gen-input-group[b-6qrgxttpjt] {
        flex-direction: column;
    }
}
/* /Shared/TrendingBadgeComponent.razor.rz.scp.css */
/* TrendingBadgeComponent.razor.css - Scoped styles for Trending Badge */

.trending-badge[b-p8jalw0zhq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    background: rgba(255, 135, 73, 0.1);
    border: 1px solid rgba(255, 135, 73, 0.3);
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #FF8749;
    font-family: 'Montserrat', sans-serif;
    line-height: 1;
    white-space: nowrap;
    animation: pulse-glow-b-p8jalw0zhq 2s ease-in-out infinite;
}

@keyframes pulse-glow-b-p8jalw0zhq {

    0%,
    100% {
        box-shadow: 0 0 5px rgba(255, 135, 73, 0.3);
    }

    50% {
        box-shadow: 0 0 15px rgba(255, 135, 73, 0.5);
    }
}

@media only screen and (max-width: 480px) {
    .trending-badge[b-p8jalw0zhq] {
        font-size: 0.6875rem;
        padding: 3px 8px;
    }
}
/* /Shared/TrustBadgeComponent.razor.rz.scp.css */
/* TrustBadgeComponent.razor.css - Scoped styles for Trust Badge */

.trust-badge-container[b-s23mg4wy1d] {
    margin: 30px 0;
    padding: 20px;
    background: linear-gradient(135deg, rgba(12, 217, 217, 0.05) 0%, rgba(255, 135, 73, 0.05) 100%);
    border: 1px solid rgba(12, 217, 217, 0.15);
    border-radius: 12px;
}

.trust-badge[b-s23mg4wy1d] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}

.trust-badge__item[b-s23mg4wy1d] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px;
    background: #FFFFFF;
    border-radius: 8px;
    border: 1px solid rgba(12, 217, 217, 0.1);
    transition: all 0.3s ease;
}

.trust-badge__item:hover[b-s23mg4wy1d] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(12, 217, 217, 0.15);
    border-color: rgba(12, 217, 217, 0.3);
}

.trust-badge__icon[b-s23mg4wy1d] {
    font-size: 1.8rem;
    line-height: 1;
}

.trust-badge__content[b-s23mg4wy1d] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.trust-badge__content strong[b-s23mg4wy1d] {
    font-size: 1rem;
    font-weight: 700;
    color: #2F3238;
    line-height: 1.2;
}

.trust-badge__content span[b-s23mg4wy1d] {
    font-size: 0.75rem;
    color: #666666;
    line-height: 1.2;
}

.trust-stats[b-s23mg4wy1d] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
    padding-top: 20px;
    border-top: 1px solid rgba(12, 217, 217, 0.1);
}

.trust-stat[b-s23mg4wy1d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 15px;
    background: #FFFFFF;
    border-radius: 8px;
    border: 1px solid rgba(12, 217, 217, 0.1);
}

.trust-stat__number[b-s23mg4wy1d] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #FF8749;
    margin-bottom: 5px;
}

.trust-stat__label[b-s23mg4wy1d] {
    font-size: 0.85rem;
    color: #666666;
}

@media (max-width: 768px) {
    .trust-badge[b-s23mg4wy1d] {
        grid-template-columns: repeat(2, 1fr);
    }

    .trust-stats[b-s23mg4wy1d] {
        grid-template-columns: 1fr;
    }
}