/* Dark theme overrides for local static page */
:root {
    /* Backgrounds */
    --helio-background-page: #121212;
    --helio-background-container: #2a2a2b;
    --helio-background-container-alternative: #141617;
    --helio-background-secondary: #141617;
    --helio-background-input: #2a2a2b;
    --helio-background-pill: #2a2a2b;
    --helio-background-primary: #fe5300;

    /* Text colors */
    --helio-text-body: #e4e7e7;
    --helio-text-highest-contrast: #ffffff;
    --helio-text-neutral: #a0a7a7;
    --helio-text-pill: #e4e7e7;
    --helio-text-link: rgb(254, 83, 0);

    /* Borders */
    --helio-border-color: #2b2f31;
    --helio-border-primary-color: #fe5300;

    /* Buttons */
    --helio-on-primary-text: #ffffff;
}

html, body {
    background-color: var(--helio-background-page) !important;
    color: var(--helio-text-body) !important;
}

/* Ensure containers/cards adopt dark background */
.helio-background-container,
.helio-background-container-alternative,
.helio-background-secondary,
.helio-background-input {
    background-color: var(--helio-background-container) !important;
}

.helio-text-body { color: var(--helio-text-body) !important; }
.helio-text-highest-contrast { color: var(--helio-text-highest-contrast) !important; }
.helio-text-neutral { color: var(--helio-text-neutral) !important; }
.helio-text-link, .helio-text-link@hover { color: var(--helio-text-link) !important; }

/* Borders and outlines */
.helio-border-color { border-color: var(--helio-border-color) !important; }
.hel-border { border-color: var(--helio-border-color) !important; }

/* Primary button coloring (approximate) */
.helio-primary-button {
    background: var(--helio-background-primary) !important;
    color: var(--helio-on-primary-text) !important;
}

/* Secondary button hover contrast adjustments */
.helio-secondary-button {
    background: #3a3b3c;
    border-color: var(--helio-border-color) !important;
    color: var(--helio-text-body) !important;
}
.helio-secondary-button:hover { background: #4a4b4c !important; }

/* Inputs */
input, textarea, select {
    background-color: var(--helio-background-input) !important;
    color: var(--helio-text-body) !important;
    border-color: var(--helio-border-color) !important;
}

/* Pills / chips */
[style*="--helio-background-pill"], .helio-background-pill {
    background-color: var(--helio-background-pill) !important;
}

/* Links */
a { color: var(--helio-text-link); }
a:hover { color: rgb(255, 120, 50); }

/* Minimal modal styles */
.wallet-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 2000;
}
.wallet-modal {
    background: #2a2a2b;
    border: 1px solid #2b2f31;
    border-radius: 16px;
    width: 600px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
    box-shadow: 0 18px 48px rgba(0,0,0,0.45);
    padding: 0;
}

.wallet-modal .helio-shadow-default {
    padding: 32px !important;
}

.wallet-modal .hel-p-6 {
    padding: 24px !important;
}
.wallet-modal header {
    padding: 14px 16px;
    border-bottom: 1px solid #2b2f31;
    color: #e4e7e7;
    font-weight: 600;
}
.wallet-modal .wallet-list { padding: 16px; }
.wallet-modal .wallet-list > div + div { margin-top: 4px !important; }
.wallet-modal .hel-flex-col.hel-gap-y-2 > div + div { margin-top: 4px !important; }

/* Remove scrollbar and improve modal content */
.wallet-modal .hel-max-h-full {
    max-height: none !important;
    overflow: visible !important;
}

.wallet-modal .hel-overflow-y-auto {
    overflow: visible !important;
}

/* Ensure modal content fits without scrolling */
.wallet-modal .hel-flex-col {
    max-height: none !important;
    overflow: visible !important;
}

/* Hide scrollbars completely */
.wallet-modal * {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE and Edge */
}

.wallet-modal *::-webkit-scrollbar {
    display: none !important; /* Chrome, Safari, Opera */
}

/* Родительский блок для позиционирования */
.helio-shadow-default.helio-background-container {
    position: relative;
    margin-top: var(--wallet-info-offset, 0px);
}

/* Убираем рамку и тень у внешней обёртки модалки */
.wallet-modal {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

/* Оставляем размеры на внутреннем контейнере */
.wallet-modal .helio-shadow-default.helio-background-container.helio-text-body.hel-p-6.hel-w-full.hel-mx-auto.hel-relative.hel-rounded.hel-flex.hel-max-h-\[calc\(100vh-20px\)\].hel-flex-col.helio-background-surface-primary.hel-max-w-\[460px\] {
    width: 520px !important;
    max-width: 520px !important;
    padding: 16px !important;
    box-shadow: none !important;
}

/* Wallet modal title styling */
.wallet-modal #wallet-modal-title {
    text-align: left !important;
    margin: 12px 0 !important;
    padding: 0 12px !important;
    font-size: 16px !important;
}

/* Wallet modal content spacing */
.wallet-modal .hel-flex.hel-flex-col.hel-gap-y-2 {
    gap: 4px !important;
}

.wallet-modal .hel-flex.hel-flex-col.hel-gap-y-2 > div {
    margin-bottom: 0 !important;
}

.wallet-modal .hel-flex.hel-flex-col.hel-gap-y-2 > div:not(:last-child) {
    margin-bottom: 4px !important;
}

/* Remove background and border from wallet buttons */
.wallet-modal .hel-flex.hel-flex-row.hel-h-\[32px\].hel-cursor-pointer.hel-items-center.hel-justify-between {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 6px 0 !important;
    height: 36px !important;
}

.wallet-modal .hel-flex.hel-flex-row.hel-h-\[32px\].hel-cursor-pointer.hel-items-center.hel-justify-between:hover {
    background: transparent !important;
    border: none !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Remove all background effects from wallet button containers */
.wallet-modal .hel-flex.hel-flex-row.hel-h-\[32px\].hel-cursor-pointer.hel-items-center.hel-justify-between > div {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.wallet-modal .hel-flex.hel-flex-row.hel-h-\[32px\].hel-cursor-pointer.hel-items-center.hel-justify-between > div:hover {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remove background from wallet button elements */
.wallet-modal .hel-flex.hel-w-full.hel-cursor-pointer.hel-items-center.hel-justify-between {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.wallet-modal .hel-flex.hel-w-full.hel-cursor-pointer.hel-items-center.hel-justify-between:hover {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Keep original icon and text sizes */
.wallet-modal .hel-w-8.hel-h-8 {
    width: 32px !important;
    height: 32px !important;
}

.wallet-modal .hel-w-8.hel-h-8.hel-relative {
    width: 32px !important;
    height: 32px !important;
}

.wallet-modal .helio-text-display.hel-text-\[18px\] {
    font-size: 18px !important;
    font-weight: 600 !important;
}

/* Keep connect buttons at reasonable size */
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 {
    padding: 6px !important;
    font-size: 12px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
}

/* Center content inside connect buttons */
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Specific styling for text and icon content */
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 .hel-text-sm {
    font-size: 10px !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 .hel-gap-x-2 {
    gap: 0 !important;
}

/* Ровное выравнивание текста и иконок в кнопках с оранжевым фоном */
.helio-primary-button span,
.helio-primary-button .hel-flex {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px; /* равномерное расстояние между иконкой и текстом */
  line-height: 1 !important;
  vertical-align: middle;
}

.helio-primary-button {
  height: 44px; /* одинаковая высота */
  padding: 0 18px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px !important;
}

.wallet-modal .hel-h-6.hel-w-6 {
    width: 20px !important;
    height: 20px !important;
}

/* Панель над конкретным блоком */
#wallet-info-menu {
    position: absolute;
    top: -60px; /* позиционируем над блоком */
    left: 0;
    right: 0;
    display: none; /* изначально скрыта */
    z-index: 1500;
    pointer-events: none; /* чтобы фон не блокировал клики */
}

/* Контейнер содержимого — чтобы клики работали */
.wallet-info-wrapper {
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(8px);
    border-radius: 12px;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid rgba(254, 83, 0, 0.2);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

.wallet-info-wrapper:hover {
    border-color: rgba(254, 83, 0, 0.3);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

/* Wallet Status */
.wallet-status {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.status-icon {
    width: 20px;
    height: 20px;
    color: #26b562;
    animation: pulse 2s infinite;
}

.status-text {
    font-size: 14px;
    font-weight: 600;
    color: var(--helio-text-primary);
    white-space: nowrap;
}

/* Wallet Balance */
.wallet-balance {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: center;
}

.balance-item {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.balance-amount {
    font-size: 16px;
    font-weight: 700;
    color: var(--helio-text-primary);
    font-family: 'Courier New', monospace;
}

.balance-currency {
    font-size: 12px;
    font-weight: 500;
    color: var(--helio-text-secondary);
}

/* Wallet Address */
.wallet-address {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.address-icon {
    width: 16px;
    height: 16px;
    color: #fe5300;
}

.address-text {
    font-size: 12px;
    font-weight: 600;
    font-family: 'Courier New', monospace;
    color: var(--helio-text-primary);
    white-space: nowrap;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.copy-btn,
.disconnect-btn {
    width: 20px;
    height: 20px;
    padding: 2px;
    background: rgba(254, 83, 0, 0.1);
    border: 1px solid rgba(254, 83, 0, 0.2);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fe5300;
}

.copy-btn:hover,
.disconnect-btn:hover {
    background: rgba(254, 83, 0, 0.2);
    border-color: rgba(254, 83, 0, 0.3);
    transform: scale(1.05);
}

.copy-btn svg,
.disconnect-btn svg {
    width: 12px;
    height: 12px;
}

/* Responsive */
@media (max-width: 768px) {
    .wallet-info-wrapper {
        flex-direction: column;
        gap: 12px;
        padding: 12px;
    }
    
    .wallet-balance {
        order: -1;
    }
    
    .wallet-address {
        width: 100%;
        justify-content: space-between;
    }
    
    .address-text {
        max-width: 120px;
    }
}


/* Pay button styles */
[data-testid="@checkout-form/primary-pay-button"] {
    display: none !important;
    transition: all 0.3s ease;
}

[data-testid="@checkout-form/primary-pay-button"]:not([disabled]) {
    background: var(--helio-background-primary) !important;
    color: white !important;
    border: 1px solid var(--helio-background-primary) !important;
}

[data-testid="@checkout-form/primary-pay-button"]:not([disabled]):hover {
    background: #e64a00 !important;
    border-color: #e64a00 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(254, 83, 0, 0.3);
}

[data-testid="@checkout-form/primary-pay-button"][disabled] {
    background: rgb(229, 231, 235) !important;
    color: var(--helio-text-neutral) !important;
    border: 1px solid rgb(229, 231, 235) !important;
    cursor: not-allowed !important;
    opacity: 1;
}

/* Connect wallet button styles */
[data-testid="@checkout-form/connect-wallet-button"] {
    display: flex !important;
    transition: all 0.3s ease;
}

/* When connect button shows PAY (wallet connected) */
[data-testid="@checkout-form/connect-wallet-button"]:not([disabled]) {
    background: var(--helio-background-primary) !important;
    color: white !important;
    border: 1px solid var(--helio-background-primary) !important;
}

[data-testid="@checkout-form/connect-wallet-button"]:not([disabled]):hover {
    background: #e64a00 !important;
    border-color: #e64a00 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(254, 83, 0, 0.3);
}

[data-testid="@checkout-form/connect-wallet-button"][disabled] {
    background: rgb(229, 231, 235) !important;
    color: var(--helio-text-neutral) !important;
    border: 1px solid rgb(229, 231, 235) !important;
    cursor: not-allowed !important;
    opacity: 1;
}

/* Wallet info display - в стиле других форм */
.wallet-info-display {
    margin-bottom: 20px;
    padding: 20px 24px;
    background: var(--helio-background-container);
    border: 1px solid var(--helio-border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
    position: relative;
    width: 100%;
    z-index: 10;
    max-width: 100%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    display: none !important; /* Скрыт по умолчанию */
}

/* Hover эффекты в стиле других форм */
.wallet-info-display:hover {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
    transform: translateY(-2px);
    border-color: rgba(254, 83, 0, 0.3);
}

/* Wallet info display - горизонтальное расположение элементов */
.wallet-info-display {
    display: none !important; /* Скрыт по умолчанию */
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 16px !important;
    flex-wrap: nowrap !important;
}

/* Показываем блок только когда кошелек подключен */
.wallet-info-display[style*="display: flex"] {
    display: flex !important;
}

/* Прижимаем правую часть к левому краю */
.wallet-right-section {
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-shrink: 0 !important;
    justify-content: flex-start !important;
}

/* Wallet status - слева */
.wallet-status {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
    margin-right: auto !important;
}

.wallet-status .hel-w-7 {
    width: 18px;
    height: 18px;
    color: #26b562 !important;
    fill: #26b562 !important;
}

.wallet-status .hel-w-7 svg {
    color: #26b562 !important;
    fill: #26b562 !important;
}

.wallet-status .hel-w-7 svg path {
    fill: #26b562 !important;
    stroke: #26b562 !important;
}

.wallet-status p {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    color: var(--helio-text-highest-contrast) !important;
    white-space: nowrap !important;
}

/* Правая часть - компактно */
.wallet-right-section {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
    justify-content: flex-start;
}

/* Wallet address info - без рамки */
.wallet-address-info {
    display: flex;
    align-items: center;
    gap: 6px;
}

.wallet-address-info .hel-flex {
    display: flex;
    align-items: center;
    gap: 4px;
}

.address-label {
    font-size: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    color: var(--helio-text-neutral) !important;
    line-height: 1 !important;
    margin-right: 4px !important;
}

.address-text {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    font-family: inherit !important;
    max-width: 120px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    opacity: 0.95 !important;
    color: var(--helio-text-highest-contrast) !important;
}

.copy-btn {
    height: 20px;
    min-height: 20px;
    padding: 0 6px;
    line-height: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
}

.copy-btn:hover {
    background: rgba(254, 83, 0, 0.1);
    transform: scale(1.1);
}

.copy-btn svg {
    width: 12px;
    height: 12px;
}

.helio-fill-primary .hel-h-4,
.helio-fill-primary .hel-w-4 {
    width: 16px;
    height: 16px;
}

/* Wallet balance info - без рамки, только SOL */
.wallet-balance-info {
    display: flex;
    align-items: center;
    gap: 8px;
}

.wallet-balance-info::after {
    content: "SOL";
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    opacity: 0.85;
    color: var(--helio-text-highest-contrast);
}

.balance-amount {
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    color: var(--helio-text-highest-contrast) !important;
    font-family: inherit !important;
}

/* Disconnect button - компактный */
#wallet-disconnect {
    height: 20px;
    min-height: 20px;
    padding: 0 6px;
    line-height: 20px;
    background: rgba(220, 53, 69, 0.1);
    border: 1px solid rgba(220, 53, 69, 0.2);
    border-radius: 4px;
    color: #dc3545;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 10px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

#wallet-disconnect:hover {
    background: rgba(220, 53, 69, 0.2);
    border-color: rgba(220, 53, 69, 0.3);
    transform: scale(1.05);
}

#wallet-disconnect svg {
    width: 12px;
    height: 12px;
}

/* Responsive design */
@media (max-width: 768px) {
    .wallet-info-display {
        padding: 16px 20px;
        margin-bottom: 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .wallet-right-section {
        width: 100%;
        justify-content: space-between;
    }
    
    .address-text {
        font-size: 11px;
    }
    
    .balance-amount {
        font-size: 13px;
    }
    
    .wallet-status p {
        font-size: 13px;
    }
}

.wallet-balance-info {
    display: flex;
    align-items: center;
    gap: 4px;
}

.wallet-address-info {
    display: flex;
    align-items: center;
    gap: 4px;
}

.balance-label,
.address-label {
    font-size: 9px;
    font-weight: 500;
    color: var(--helio-text-secondary);
    opacity: 0.7;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 0.2px;
    text-transform: uppercase;
}

.balance-amount {
    font-size: 10px;
    font-weight: 600;
    color: var(--helio-text-primary);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 0.1px;
}

.address-text {
    font-size: 9px;
    font-weight: 500;
    color: var(--helio-text-primary);
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Source Code Pro', monospace;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 0.9;
    letter-spacing: 0.05px;
}

/* Responsive wallet info */
@media (max-width: 768px) {
    .wallet-info-content {
        gap: 12px;
    }
    
    .balance-label,
    .address-label {
        font-size: 8px;
    }
    
    .balance-amount {
        font-size: 9px;
    }
    
    .address-text {
        font-size: 8px;
        max-width: 80px;
    }
}

/* Wallet info marquee styles */
.hel-absolute.hel-top-5.hel-left-4 {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--helio-background-container);
    border: 1px solid var(--helio-border-color);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    width: 100% !important;
}

.hel-absolute.hel-top-5.hel-left-4:hover {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
}

/* Marquee container */
[data-testid="@components/ui/marquee"] {
    background: linear-gradient(135deg, var(--helio-background-container) 0%, rgba(254, 83, 0, 0.05) 100%);
    border-radius: 12px;
    padding: 8px;
}

/* Marquee items */
[data-testid="@components/ui/marquee"] li {
    background: transparent;
    border-radius: 8px;
    padding: 8px 12px;
    transition: all 0.3s ease;
}

[data-testid="@components/ui/marquee"] li:hover {
    background: rgba(254, 83, 0, 0.1);
}

/* Wallet connected status */
#marquee-item-0 {
    background: linear-gradient(135deg, rgba(38, 181, 98, 0.1) 0%, rgba(38, 181, 98, 0.05) 100%);
    border-radius: 8px;
    border: 1px solid rgba(38, 181, 98, 0.2);
}

#marquee-item-0 .helio-fill-success {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Balance items */
#marquee-item-1, #marquee-item-2 {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.05) 0%, transparent 100%);
    border-radius: 8px;
    border: 1px solid rgba(254, 83, 0, 0.1);
}

#marquee-item-1:hover, #marquee-item-2:hover {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.1) 0%, rgba(254, 83, 0, 0.05) 100%);
    border-color: rgba(254, 83, 0, 0.2);
}

/* Token icons */
[data-testid="@components/ui/tokenIcon"] {
    background: linear-gradient(135deg, var(--helio-background-pill) 0%, rgba(254, 83, 0, 0.1) 100%) !important;
    border: 1px solid rgba(254, 83, 0, 0.2) !important;
    transition: all 0.3s ease;
}

[data-testid="@components/ui/tokenIcon"]:hover {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.2) 0%, rgba(254, 83, 0, 0.1) 100%) !important;
    border-color: rgba(254, 83, 0, 0.3) !important;
    transform: scale(1.05);
}

/* Address section */
.hel-flex.hel-max-w-full.hel-flex-row.hel-align-center.hel-gap-x-1 {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.05) 0%, transparent 100%);
    border-radius: 8px;
    padding: 6px 10px;
    border: 1px solid rgba(254, 83, 0, 0.1);
    transition: all 0.3s ease;
}

.hel-flex.hel-max-w-full.hel-flex-row.hel-align-center.hel-gap-x-1:hover {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.1) 0%, rgba(254, 83, 0, 0.05) 100%);
    border-color: rgba(254, 83, 0, 0.2);
}

/* Address text */
.hel-truncate.hel-max-w-[100px] {
    font-family: 'Courier New', monospace;
    font-weight: 600;
    color: var(--helio-text-highest-contrast);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Copy button */
.helio-text-link.hel-flex.hel-cursor-pointer {
    background: rgba(254, 83, 0, 0.1);
    border-radius: 6px;
    padding: 4px 8px;
    border: 1px solid rgba(254, 83, 0, 0.2);
    transition: all 0.3s ease;
}

.helio-text-link.hel-flex.hel-cursor-pointer:hover {
    background: rgba(254, 83, 0, 0.2);
    border-color: rgba(254, 83, 0, 0.3);
    transform: scale(1.05);
}

/* Dropdown button */
[data-testid="@components/ui/button-basic"] {
    background: linear-gradient(135deg, var(--helio-background-container) 0%, rgba(254, 83, 0, 0.05) 100%);
    border: 1px solid rgba(254, 83, 0, 0.2);
    border-radius: 8px;
    transition: all 0.3s ease;
}

[data-testid="@components/ui/button-basic"]:hover {
    background: linear-gradient(135deg, rgba(254, 83, 0, 0.1) 0%, rgba(254, 83, 0, 0.05) 100%);
    border-color: rgba(254, 83, 0, 0.3);
    transform: scale(1.05);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .hel-absolute.hel-top-5.hel-left-4 {
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        margin: 0 !important;
    }
    
    [data-testid="@components/ui/marquee"] {
        padding: 6px;
    }
    
    [data-testid="@components/ui/marquee"] li {
        padding: 6px 8px;
    }
}
.wallet-button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    min-height: 64px;
    border-radius: 12px;
    background: #181b1c;
    border: 1px solid var(--helio-border-color);
    color: var(--helio-text-body);
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: 0;
}
.wallet-button + .wallet-button { margin-top: 0; }
.wallet-button:hover { 
    background: #1e2325; 
    border-color: #374044; 
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.wallet-button:active {
    transform: translateY(0);
}
.wallet-icon { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; }
.wallet-icon img, .wallet-icon svg { width: 100%; height: 100%; }
.wallet-modal footer { padding: 10px 12px 14px; color: #a0a7a7; font-size: 12px; }

.wallet-modal-backdrop.is-open { display: flex; }

/* Hero icon in modal header */
.wallet-hero-icon { color: #fe5300; width: 34px; height: 34px; }
.wallet-hero-icon svg path { fill: #fe5300 !important; }

/* Title styling */
#wallet-modal-title { 
    letter-spacing: 0.2px; 
    margin: 24px 0 24px 0;
    padding: 0 16px;
    text-align: center;
    line-height: 1.5;
    font-weight: 500;
    color: var(--helio-text-body);
}

/* Wallet modal content spacing */
.wallet-modal .hel-mx-2 {
    margin-left: 16px !important;
    margin-right: 16px !important;
}

.wallet-modal .hel-mt-5 {
    margin-top: 24px !important;
}

/* Hero icon spacing */
.wallet-modal .wallet-hero-icon {
    margin: 0 16px !important;
}

/* Wallet modal spacing improvements */
.wallet-modal .hel-flex-col.hel-gap-y-2 {
    gap: 16px !important;
}

.wallet-modal .hel-flex-col.hel-gap-y-2 > div {
    margin-bottom: 0 !important;
}

.wallet-modal .hel-flex-col.hel-gap-y-2 > div:not(:last-child) {
    margin-bottom: 16px !important;
}

/* Mint quantity card styles */
.mint-qty-card {
    margin: 12px;
    border: 1px solid var(--helio-border-color);
    border-radius: 12px;
    background: var(--helio-background-container);
    box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}

/* Imported styles from your site */
.hel-font-normal {
    font-weight: 400 !important;
}

.hel-text-xs {
    font-size: .75rem !important;
    line-height: 1rem !important;
}

.hel-text-center {
    text-align: center !important;
}

.hel-gap-x-2 {
    -moz-column-gap: .5rem!important;
    column-gap: .5rem !important;
}

.hel-justify-center {
    justify-content: center !important;
}

.hel-items-center {
    align-items: center !important;
}

.hel-flex {
    display: flex !important;
}

.helio-secondary-button {
    background: #3a3b3c !important;
    color: var(--helio-text-link) !important;
    fill: var(--helio-text-link) !important;
}

.hel-leading-\[140\%\] {
    line-height: 140% !important;
}

.hel-normal-case {
    text-transform: none !important;
}

.hel-font-semibold {
    font-weight: 600 !important;
}

[role=button], button {
    cursor: pointer;
}

button, select {
    text-transform: none;
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
}

.helio-text-body {
    color: var(--helio-text-body) !important;
}

.helio-preflight {
    font-family: InnovatorGrotesk, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-size: .75rem;
    line-height: 1rem;
    color: var(--helio-text-body);
}

body {
    margin: 0;
    line-height: inherit;
}

html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-feature-settings: normal;
    font-variation-settings: normal;
}

.helio-preflight ::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.helio-preflight ::-webkit-scrollbar-thumb {
    background: #808b9d;
    border-radius: 4px;
}

/* Dark styling for input elements */
.helio-border-input.helio-outline\@focus-within.hel-flex.hel-w-full.hel-items-center.hel-justify-between.hel-gap-x-1.helio-background-input.helio-border-color.hel-px-3.hel-py-3.helio-standard-animation.hel-border.hel-rounded {
    background-color: #191919 !important;
    border-color: #191919 !important;
}

/* Recipient address styling */
.recipient-address {
    color: rgb(176, 178, 192) !important;
}

/* Cursor pointer with highest contrast hover styling */
.hel-cursor-pointer.helio-text-highest-contrast\@hover.hel-font-bold.hel-underline {
    color: rgb(176, 178, 192) !important;
}

/* Total price styling */
.total-price {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgb(58, 59, 60);
    background-image: none;
    background-origin: padding-box;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-size: auto;
    border-bottom-color: rgb(229, 231, 235);
    border-bottom-left-radius: 9999px;
    border-bottom-right-radius: 9999px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(229, 231, 235);
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: rgb(229, 231, 235);
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: rgb(229, 231, 235);
    border-top-left-radius: 9999px;
    border-top-right-radius: 9999px;
    border-top-style: solid;
    border-top-width: 1px;
    box-sizing: border-box;
    color: rgb(176, 178, 192);
    color-scheme: dark;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 140%;
    font-family: InnovatorGrotesk, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-feature-settings: normal;
    font-size: 12px;
    font-variation-settings: normal;
    height: 48px;
    padding: 4px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    transition: all 0.3s ease;
    print-color-adjust: exact;
    tab-size: 4;
    text-size-adjust: 100%;
    unicode-bidi: isolate;
    width: 334.406px;
    -webkit-font-smoothing: antialiased;
}

.total-price:focus {
    outline: none;
}

.total-price:focus-visible {
    ring: 2px;
    ring-color: var(--helio-background-primary);
}

.total-price:disabled {
    cursor: not-allowed;
    border: none;
}

/* Price banner styling */
.hel-flex.hel-items-center.hel-h-full.hel-justify-between.hel-mx-4.helio-text-price-banner {
    border-radius: 9999px !important;
    border: 1px solid rgb(36, 37, 37) !important;
    background-color: rgb(36, 37, 37) !important;
    width: 100% !important;
    padding: 12px 16px !important;
    margin-left: -4px !important;
}

/* Recipient button styling */
.hel-w-fit.hel-rounded.hel-py-1.hel-px-2.helio-text-wallet.helio-background-wallet {
    border-radius: 9999px !important;
    background-color: rgb(36, 37, 37) !important;
    border: 1px solid rgb(36, 37, 37) !important;
}

/* Disclaimer styling */
.helio-text-low-contrast.helio-background-checkout-footer.hel-py-1.hel-px-2.hel-text-xs.hel-rounded {
    border-radius: 9999px !important;
    background-color: rgb(36, 37, 37) !important;
    border: 1px solid rgb(36, 37, 37) !important;
}
.mint-qty-card__body { padding: 14px; }
.mint-qty-card__title {
    margin: 0 0 8px 0;
    color: var(--helio-text-highest-contrast);
    font-size: 16px;
    font-weight: 600;
}
.mint-qty-card__segmented {
    display: inline-flex;
    border: 1px solid var(--helio-border-color);
    border-radius: 10px;
    overflow: hidden;
    background: #151819;
}
.mint-qty-card__segmented button {
    padding: 8px 12px;
    background: transparent;
    color: var(--helio-text-body);
    border: none;
    cursor: pointer;
}
.mint-qty-card__segmented button + button { border-left: 1px solid var(--helio-border-color); }
.mint-qty-card__segmented button.is-active { background: #1f2426; color: var(--helio-text-highest-contrast); }
.mint-qty-card__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.mint-qty-card__total { color: var(--helio-text-highest-contrast); font-weight: 600; }
.mint-qty-card__sub { color: var(--helio-text-neutral); font-size: 12px; }
.mint-qty-card__cta { margin-top: 12px; }
.mint-qty-card__cta .btn {
    width: 100%;
    padding: 10px 14px;
    border-radius: 999px;
    border: 1px solid transparent;
    font-weight: 700;
}
.btn-primary { background: var(--helio-background-primary); color: var(--helio-on-primary-text); }
.btn-primary:hover { filter: brightness(1.05); }

/* Pulse animation for status icon */
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Center hel-h-6 hel-w-6 elements within their containers */
.hel-h-6.hel-w-6 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
}

/* Center hel-h-6 hel-w-6 elements within primary buttons */
.hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 .hel-h-6.hel-w-6 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
}

/* Center hel-h-6 hel-w-6 elements within span containers */
.hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 span .hel-h-6.hel-w-6 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
}

/* Force white icon fills in modal controls and primary connect buttons */
.wallet-modal .hel-h-8.hel-w-8.hel-cursor-pointer.helio-fill-surface-secondary-soft,
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 span .hel-h-6.hel-w-6 {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.wallet-modal .hel-h-8.hel-w-8.hel-cursor-pointer.helio-fill-surface-secondary-soft svg,
.wallet-modal .hel-h-8.hel-w-8.hel-cursor-pointer.helio-fill-surface-secondary-soft svg path,
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 svg,
.wallet-modal .hel-inline-flex.hel-items-center.hel-justify-center.hel-rounded.hel-font-semibold.hel-leading-\[140\%\].focus\:hel-outline-none.focus-visible\:hel-ring.focus-visible\:hel-ring-primary.helio-animate-colors.hel-uppercase.helio-primary-button.disabled\:hel-cursor-not-allowed.disabled\:hel-border-none.hel-p-1 svg path {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}