@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap";

/* CSS Variables - Dark Theme */
:root {
    --font-inter: "Inter", sans-serif;
    --font-mono: "JetBrains Mono", monospace;
    --background: 240 6% 4%;
    --foreground: 0 0% 95%;
    --card: 240 5% 7%;
    --card-foreground: 0 0% 95%;
    --popover: 240 5% 7%;
    --popover-foreground: 0 0% 95%;
    --primary: 220 80% 56%;
    --primary-foreground: 0 0% 100%;
    --secondary: 240 4% 14%;
    --secondary-foreground: 0 0% 88%;
    --muted: 240 4% 14%;
    --muted-foreground: 0 0% 55%;
    --accent: 220 80% 56%;
    --accent-foreground: 0 0% 100%;
    --destructive: 0 72% 51%;
    --destructive-foreground: 0 0% 98%;
    --border: 240 4% 18%;
    --input: 240 4% 18%;
    --ring: 220 80% 56%;
    --chart-1: 220 80% 56%;
    --chart-2: 160 60% 45%;
    --chart-3: 30 80% 55%;
    --chart-4: 280 65% 60%;
    --chart-5: 340 75% 55%;
    --radius: .25rem;
    --sidebar-background: 240 6% 4%;
    --sidebar-foreground: 0 0% 88%;
    --sidebar-primary: 220 80% 56%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 240 4% 14%;
    --sidebar-accent-foreground: 0 0% 88%;
    --sidebar-border: 240 4% 18%;
    --sidebar-ring: 220 80% 56%;
    --success: 152 60% 45%;
    --success-foreground: 0 0% 100%;
    --warning: 38 92% 50%;
    --warning-foreground: 0 0% 100%;
}

/* Reset and Base Styles */
.vv-raffle-dashboard * {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: hsl(var(--border));
}

.vv-raffle-dashboard {
    font-family: var(--font-inter);
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    display: flex;
    min-height: 100vh;
    line-height: 1.5;
}

/* Sidebar Styles */
.vv-raffle-sidebar {
    width: 240px;
    background-color: hsl(var(--sidebar-background));
    border-right: 1px solid hsl(var(--sidebar-border));
    padding: 24px 0;
  
    height: 100vh;
  
}

.vv-raffle-logo {
    padding: 0 24px 24px 24px;
    border-bottom: 1px solid hsl(var(--sidebar-border));
    margin-bottom: 24px;
}

.vv-raffle-logo h2 {
    font-size: 18px;
    font-weight: 700;
    color: hsl(var(--sidebar-foreground));
    margin: 0;
    letter-spacing: -0.025em;
}

.vv-raffle-nav {
    padding: 0 12px;
}

.vv-raffle-nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 12px;
    margin-bottom: 4px;
    border-radius: var(--radius);
    color: hsl(var(--sidebar-foreground));
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
    cursor: pointer;
}

.vv-raffle-nav-item:hover {
    background-color: #D71920;
    color: hsl(var(--sidebar-accent-foreground));
}

.vv-raffle-nav-item.active {
    background-color: #D71920;
    color: hsl(var(--sidebar-primary-foreground));
}

.vv-raffle-nav-item svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* Main Content */
.vv-raffle-main {
    flex: 1;
    /* margin-left: 240px; */
    padding: 32px;
    background-color: hsl(var(--background));
}

/* Tab System */
.vv-raffle-tab {
    display: none;
}

.vv-raffle-tab.active {
    display: block;
}

/* Header */
.vv-raffle-header {
    margin-bottom: 32px;
}

.vv-raffle-header h1 {
    font-size: 32px;
    font-weight: 700;
    color: hsl(var(--foreground));
    margin: 0 0 8px 0;
    letter-spacing: -0.025em;
}

.vv-raffle-header p {
    font-size: 16px;
    color: hsl(var(--muted-foreground));
    margin: 0;
}

/* Grid System */
.grid {
    display: grid;
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gap-4 {
    gap: 16px;
}

.mb-8 {
    margin-bottom: 32px;
}

/* Card Styles */
.p-6 {
    padding: 24px;
}

.rounded-sm {
    border-radius: var(--radius);
}

.border {
    border-width: 1px;
}

.border-border {
    border-color: hsl(var(--border));
}

.bg-card {
    background-color: hsl(var(--card));
}

.flex {
    display: flex;
}

.items-start {
    align-items: flex-start;
}

.items-center {
    align-items: center;
}

.justify-between {
    justify-content: space-between;
}

.mb-4 {
    margin-bottom: 16px;
}

.mb-1 {
    margin-bottom: 4px;
}

.w-10 {
    width: 40px;
}

.h-10 {
    height: 40px;
}

.w-5 {
    width: 20px;
}

.h-5 {
    height: 20px;
}

.bg-primary\/10 {
    background-color: hsl(var(--primary) / 0.1);
}

.text-primary {
    color: hsl(var(--primary));
}

.bg-success\/10 {
    background-color: hsl(var(--success) / 0.1);
}

.text-success {
    color: hsl(var(--success));
}

.bg-warning\/10 {
    background-color: hsl(var(--warning) / 0.1);
}

.text-warning {
    color: hsl(var(--warning));
}

.bg-chart-4\/10 {
    background-color: hsl(var(--chart-4) / 0.1);
}

.text-chart-4 {
    color: hsl(var(--chart-4));
}

.font-mono {
    font-family: var(--font-mono);
}

.text-3xl {
    font-size: 30px;
    line-height: 36px;
}

.font-bold {
    font-weight: 700;
}

.text-sm {
    font-size: 14px;
    line-height: 20px;
}

.text-muted-foreground {
    color: hsl(var(--muted-foreground));
}

/* Active Raffle Card */
.vv-raffle-active-card {
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 24px;
    margin-bottom: 24px;
}

.vv-raffle-active-header {
    margin-bottom: 16px;
}

.vv-raffle-active-badge {
    background-color: #D71920;
    color: hsl(var(--primary-foreground));
    padding: 4px 12px;
    border-radius: var(--radius);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.vv-raffle-active-content h3 {
    font-size: 24px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 16px 0 8px 0;
}

.vv-raffle-active-content p {
    font-size: 16px;
    color: hsl(var(--muted-foreground));
    margin: 0;
}

.vv-raffle-active-action {
    margin-top: 16px;
}

/* Buttons */
.vv-raffle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: var(--radius);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.vv-raffle-btn-primary {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}

.vv-raffle-btn-primary:hover {
    background-color: hsl(var(--primary) / 0.9);
}

/* Loading State */
.vv-raffle-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px;
    color: hsl(var(--muted-foreground));
    font-size: 16px;
}

/* Empty State */
.vv-raffle-empty-state {
    text-align: center;
    padding: 48px 24px;
}

.vv-raffle-empty-icon {
    margin-bottom: 16px;
    color: hsl(var(--muted-foreground));
}

.vv-raffle-empty-state h3 {
    font-size: 20px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 8px 0;
}

.vv-raffle-empty-state p {
    font-size: 16px;
    color: hsl(var(--muted-foreground));
    margin: 0;
}

/* Tickets Grid */
.vv-raffle-tickets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.vv-raffle-ticket-card {
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 20px;
}

.vv-raffle-ticket-number {
    font-family: var(--font-mono);
    font-size: 18px;
    font-weight: 700;
    color: hsl(var(--primary));
    margin-bottom: 12px;
}

.vv-raffle-ticket-info h4 {
    font-size: 16px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 4px 0;
}

.vv-raffle-ticket-info p {
    font-size: 14px;
    color: hsl(var(--muted-foreground));
    margin: 0;
}

/* Purchase Form */
.vv-raffle-purchase-form {
    max-width: 600px;
}

.vv-raffle-current-raffle {
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 24px;
    margin-bottom: 24px;
}

.vv-raffle-current-raffle h3 {
    font-size: 18px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 16px 0;
}

.vv-raffle-raffle-info h4 {
    font-size: 20px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 8px 0;
}

.vv-raffle-raffle-info p {
    font-size: 14px;
    color: hsl(var(--muted-foreground));
    margin: 0 0 4px 0;
}

.vv-raffle-quantity-section {
    margin-bottom: 24px;
}

.vv-raffle-quantity-section h4 {
    font-size: 16px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 16px 0;
}

.vv-raffle-quantity-buttons {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.vv-raffle-qty-btn {
    padding: 8px 16px;
    border: 1px solid hsl(var(--border));
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    border-radius: var(--radius);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.vv-raffle-qty-btn:hover,
.vv-raffle-qty-btn.active {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    border-color: hsl(var(--primary));
}

.vv-raffle-custom-qty input {
    width: 100px;
    padding: 8px 12px;
    border: 1px solid hsl(var(--border));
    background-color: hsl(var(--input));
    color: hsl(var(--foreground));
    border-radius: var(--radius);
    font-size: 14px;
}

.vv-raffle-total-section {
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 24px;
}

.vv-raffle-qty-card {
    text-align: center;
    margin-bottom: 24px;
}

.vv-raffle-qty-label {
    font-size: 14px;
    color: hsl(var(--muted-foreground));
    margin: 0 0 16px 0;
}

.vv-raffle-qty-main {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin-bottom: 16px;
}

.vv-raffle-qty-step {
    width: 48px;
    height: 48px;
    border: 1px solid hsl(var(--input));
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    border-radius: var(--radius);
    font-size: 28px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.vv-raffle-qty-step:hover {
    background-color: hsl(var(--accent));
    color: hsl(var(--accent-foreground));
}

.vv-raffle-qty-display {
    font-family: var(--font-mono);
    font-size: 64px;
    font-weight: 700;
    line-height: 1;
    min-width: 80px;
    text-align: center;
}

.vv-raffle-calculation {
    font-size: 16px;
    color: hsl(var(--muted-foreground));
    margin-bottom: 8px;
}

.vv-raffle-calculation-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.vv-raffle-total {
    font-size: 20px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin-bottom: 16px;
}

.vv-raffle-pay-btn {
    width: 100%;
    font-size: 16px;
    padding: 16px 24px;
}

/* Orders List */
.vv-raffle-orders-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.vv-raffle-order-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 20px;
}

.vv-raffle-order-info h4 {
    font-size: 16px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 4px 0;
}

.vv-raffle-order-info p {
    font-size: 14px;
    color: hsl(var(--muted-foreground));
    margin: 0 0 2px 0;
}

.vv-raffle-order-amount {
    text-align: right;
}

.vv-raffle-amount {
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin-bottom: 4px;
}

.vv-raffle-status {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 2px 8px;
    border-radius: var(--radius);
}

.vv-raffle-status-paid {
    background-color: hsl(var(--success) / 0.1);
    color: hsl(var(--success));
}

.vv-raffle-status-pending {
    background-color: hsl(var(--warning) / 0.1);
    color: hsl(var(--warning));
}

.vv-raffle-status-failed {
    background-color: hsl(var(--destructive) / 0.1);
    color: hsl(var(--destructive));
}

/* Profile Form */
.vv-raffle-profile-form {
    max-width: 600px;
}

.vv-raffle-form-section {
    margin-bottom: 32px;
	margin-top: 20px;
}

.vv-raffle-form-section h3 {
    font-size: 18px;
    font-weight: 600;
    color: hsl(var(--foreground));
    margin: 0 0 16px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid hsl(var(--border));
}

.vv-raffle-form-group {
    margin-bottom: 16px;
}

.vv-raffle-form-group label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: hsl(var(--foreground));
    margin-bottom: 6px;
}

.vv-raffle-form-group input,
.vv-raffle-form-group textarea,
.vv-raffle-form-group select {
    width: 100%;
    padding: 12px;
    border: 1px solid hsl(var(--border));
    background-color: hsl(var(--input));
    color: hsl(var(--foreground));
    border-radius: var(--radius);
    font-size: 14px;
    font-family: inherit;
}

.vv-raffle-form-group input:focus,
.vv-raffle-form-group textarea:focus,
.vv-raffle-form-group select:focus {
    outline: none;
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 2px hsl(var(--ring) / 0.2);
}

.vv-raffle-form-group select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 40px;
    background-image: linear-gradient(45deg, transparent 50%, hsl(var(--muted-foreground)) 50%), linear-gradient(135deg, hsl(var(--muted-foreground)) 50%, transparent 50%);
    background-position: calc(100% - 20px) calc(50% - 3px), calc(100% - 14px) calc(50% - 3px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
}

.vv-raffle-form-group input[readonly] {
    background-color: hsl(var(--muted));
    color: hsl(var(--muted-foreground));
    cursor: not-allowed;
}

.vv-raffle-form-group textarea {
    min-height: 80px;
    resize: vertical;
}

/* Enter Raffle Button */
.vv-raffle-enter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 32px;
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    text-decoration: none;
    border-radius: var(--radius);
    font-size: 16px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.vv-raffle-enter-btn:hover {
    background-color: hsl(var(--primary) / 0.9);
    text-decoration: none;
    color: hsl(var(--primary-foreground));
}

/* Success Modal */
.vv-raffle-success-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.vv-raffle-success-modal__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.7);
}

.vv-raffle-success-modal__content {
    position: relative;
    width: 100%;
    max-width: 540px;
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    padding: 24px;
}

.vv-raffle-success-modal__content h3 {
    margin: 0 0 8px;
    font-size: 22px;
    font-weight: 700;
}

.vv-raffle-success-modal__subtitle {
    margin: 0 0 16px;
    color: hsl(var(--muted-foreground));
}

.vv-raffle-success-modal__details {
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: 16px;
}

.vv-raffle-success-modal__row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid hsl(var(--border));
}

.vv-raffle-success-modal__row:last-child {
    border-bottom: 0;
}

.vv-raffle-success-modal__label {
    color: white;
}

.vv-raffle-success-modal__value {
    font-weight: 600;
    text-align: right;
    word-break: break-word;
    color: white;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .vv-raffle-sidebar {
        width: 200px;
    }
    
    .vv-raffle-main {
        margin-left: 200px;
        padding: 24px 16px;
    }
    
    .sm\:grid-cols-2 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    
    .vv-raffle-header h1 {
        font-size: 24px;
    }
}

@media (max-width: 640px) {
    .vv-raffle-dashboard {
        flex-direction: column;
    }
    
    .vv-raffle-sidebar {
        width: 100%;
        height: auto;
        position: relative;
        border-right: none;
        border-bottom: 1px solid hsl(var(--sidebar-border));
    }
    
    .vv-raffle-main {
        margin-left: 0;
        padding: 16px;
    }
    
    .vv-raffle-nav {
        display: flex;
        overflow-x: auto;
        padding: 0 12px 12px 12px;
    }
    
    .vv-raffle-nav-item {
        flex-shrink: 0;
        margin-right: 8px;
        margin-bottom: 0;
    }
    
    .vv-raffle-order-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .vv-raffle-order-amount {
        text-align: left;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}

div#overview .grid svg {
    margin: auto;
}

/* Auth pages (login/register) */
.vv-raffle-auth {
    width: 100%;
    max-width: 520px;
    margin: 48px auto;
    padding: 28px;
    background-color: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    color: hsl(var(--foreground));
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
}

.vv-raffle-auth h2 {
    margin: 0 0 20px;
    font-size: 28px;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: hsl(var(--foreground));
}

.vv-raffle-auth p {
    margin: 0 0 14px;
    color: hsl(var(--muted-foreground));
}

.vv-raffle-auth label {
    display: inline-block;
    margin-bottom: 6px;
    color: hsl(var(--foreground));
    font-weight: 600;
    font-size: 14px;
}

.vv-raffle-auth input[type="text"],
.vv-raffle-auth input[type="email"],
.vv-raffle-auth input[type="password"] {
    width: 100%;
    height: 42px;
    padding: 10px 12px;
    border: 1px solid hsl(var(--input));
    border-radius: var(--radius);
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.vv-raffle-auth input[type="text"]::placeholder,
.vv-raffle-auth input[type="email"]::placeholder,
.vv-raffle-auth input[type="password"]::placeholder {
    color: hsl(var(--muted-foreground));
}

.vv-raffle-auth input[type="text"]:focus,
.vv-raffle-auth input[type="email"]:focus,
.vv-raffle-auth input[type="password"]:focus {
    border-color: hsl(var(--ring));
    box-shadow: 0 0 0 3px hsl(var(--ring) / 0.25);
    outline: none;
}

.vv-raffle-auth input[type="checkbox"] {
    margin-right: 8px;
    accent-color: hsl(var(--primary));
}

.vv-raffle-auth .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border: 1px solid hsl(var(--primary));
    border-radius: var(--radius);
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.12s ease, filter 0.2s ease;
}

.vv-raffle-auth .button:hover {
    filter: brightness(1.05);
}

.vv-raffle-auth .button:active {
    transform: translateY(1px);
}

.vv-raffle-auth .notice {
    margin: 0 0 16px;
    padding: 10px 12px;
    border-radius: var(--radius);
    border: 1px solid hsl(var(--border));
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
}

.vv-raffle-auth .notice.notice-error {
    border-color: hsl(var(--destructive) / 0.45);
    background: hsl(var(--destructive) / 0.14);
}

.vv-raffle-auth .notice.notice-success {
    border-color: hsl(var(--success) / 0.45);
    background: hsl(var(--success) / 0.14);
}

.vv-raffle-auth a {
    color: hsl(var(--primary));
}

.vv-raffle-auth-message {
    max-width: 520px;
    margin: 48px auto;
    padding: 20px;
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    background: hsl(var(--card));
}

/* Public draw results */
.vv-raffle-results {
    max-width: 1100px;
    margin: 32px auto;
    color: hsl(var(--foreground));
}

.vv-raffle-results h2 {
    margin: 0 0 10px;
    font-size: 30px;
    letter-spacing: -0.02em;
}

.vv-raffle-results > p {
    margin: 0 0 16px;
    color: hsl(var(--muted-foreground));
}

.vv-raffle-results-table {
    width: 100%;
    border-collapse: collapse;
    background: hsl(var(--card));
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    overflow: hidden;
}

.vv-raffle-results-table th,
.vv-raffle-results-table td {
    padding: 12px 14px;
    border-bottom: 1px solid hsl(var(--border));
    text-align: left;
}

.vv-raffle-results-table th {
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    font-weight: 600;
}

.vv-raffle-results-table td {
    color: hsl(var(--muted-foreground));
}

@media (max-width: 640px) {
    .vv-raffle-auth {
        margin: 20px auto;
        padding: 18px;
    }

    .vv-raffle-auth h2 {
        font-size: 24px;
    }
}

.vv-raffle-order-actions {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.vv-raffle-order-actions .vv-raffle-btn {
    padding: 8px 12px;
    font-size: 13px;
}

.vv-raffle-order-delete {
    background-color: transparent;
    border: 1px solid hsl(var(--border));
    color: hsl(var(--foreground));
}

.vv-raffle-order-delete:hover {
    background-color: hsl(var(--muted));
}