/* Базовые стили */
body {
    background: #f7f9fc;
    color: #1a202c;
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    min-height: 100vh;
}

.dark body {
    background: #4a5568;
    color: #f7f9fc;
}

.container {
    margin: 0 auto;
    padding: 1rem;
}

button, input, optgroup, select, textarea {
    padding: 0;
    line-height: inherit;
    color: #000000;
}

/* Панель настроек */
.settings-panel {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
}

.settings-panel .flex.items-center.ml-auto {
    margin-left: auto;
}

.settings-panel .container-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.settings-panel label {
    font-size: 0.75rem;
    color: #6b7280;
}

.dark .settings-panel label {
    color: #ffffff;
}

.dark #reason-filter, .dark #action-select-rejected, .dark #sort-by {
    color: #fff;
    background: #2d3748;
}

.settings-panel select,
.settings-panel input {
    background: #f1f3f5;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

.dark .settings-panel select,
.dark .settings-panel input {
    background: #2d3748;
    color: #f7f9fc;
    border: 1px solid #4a5568;
}

/* Панель сортировки и причины */
.justify-between {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

.justify-between-history {
    margin-bottom: 0 !important;
}

.justify-between label {
    font-size: 0.75rem;
    color: #6b7280;
}

.dark .justify-between label {
    color: #a0aec0;
}

.card {
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.card::-webkit-scrollbar {
    display: none;
}

.justify-between select {
    background: #f1f3f5;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

.dark .justify-between select {
    background: #2d3748;
    color: #f7f9fc;
    border: 1px solid #4a5568;
}

.justify-between select#reason-filter {
    min-width: 150px;
}

#show-x-history {
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 5px;
    transition: background 0.2s ease;
    background: #1a56db;
    color: #fff;
}

.dark #show-x-history {
    background: #2c5282;
}

#show-x-history:hover {
    background: #1545b5;
}

.dark #show-x-history:hover {
    background: #2b6cb0;
}

.filter-button {
    background: #1a56db;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    transition: background 0.2s ease;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
}

.dark .filter-button {
    background: #2c5282;
}

.filter-button:hover {
    background: #1545b5;
}

.dark .filter-button:hover {
    background: #2b6cb0;
}

.filter-dropdown {
    position: absolute;
    top: 110%;
    right: 0;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    padding: 1rem;
    z-index: 1000;
    min-width: 200px;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: space-evenly;
    align-items: flex-end;
}

.dark .filter-dropdown {
    background: #2d3748;
    border: 1px solid #4a5568;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.rejected-filter-dropdown {
    position: absolute;
    top: 33%;
    right: 131px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    padding: 1rem;
    z-index: 1000;
    min-width: 200px;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: space-evenly;
    align-items: flex-end;
}

.dark .rejected-filter-dropdown {
    background: #2d3748;
    border: 1px solid #4a5568;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.filter-item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-item label {
    font-size: 0.75rem;
    color: #1a202c;
}

.dark .filter-item label {
    color: #f7f9fc;
}

.filter-item select {
    background: #f1f3f5;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

.dark .filter-item select {
    background: #4a5568;
    color: #f7f9fc;
    border: 1px solid #718096;
}

.hidden {
    display: none;
}

/* Стили для статистики */
.stats-grid {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
}

.stats-item {
    background: #f7f7f7;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    max-width: 300px;
}

.dark .stats-item {
    background: #4a5568;
}

.stats-item h3 {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6b7280;
}

.dark .stats-item h3 {
    color: #a0aec0;
}

.stats-item ol,
.stats-item ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.stats-item li {
    font-size: 0.875rem;
    color: #1a202c;
    font-weight: 600;
}

.dark .stats-item li {
    color: #f7f9fc;
}

.stats-item span {
    color: #48bb78;
    font-size: 0.875rem;
    font-weight: 600;
}

#total-contracts {
    color: #767778;
}

.dark #total-contracts {
    color: #a0aec0;
}

#active-contracts {
    color: #00a83e;
}

.dark #active-contracts {
    color: #48bb78;
}

#archived-contracts {
    color: #bfbb21;
}

.dark #archived-contracts {
    color: #ecc94b;
}

#deleted-contracts {
    color: #ff3860;
}

.dark #deleted-contracts {
    color: #fc8181;
}

#averageX24h.positive,
#averageXAllTime.positive {
    color: #00a83e;
    font-weight: 600;
}

.dark #averageX24h.positive,
.dark #averageXAllTime.positive {
    color: #48bb78;
}

#averageX24h.negative,
#averageXAllTime.negative {
    color: #ff3860;
    font-weight: 600;
}

.dark #averageX24h.negative,
.dark #averageXAllTime.negative {
    color: #fc8181;
}

#averageX24h.neutral,
#averageXAllTime.neutral {
    color: #1a202c;
    font-weight: 500;
}

.dark #averageX24h.neutral,
.dark #averageXAllTime.neutral {
    color: #e2e8f0;
}

#topX,
#topXAllTime {
    font-size: 0.875rem;
    color: #1a202c;
}

.dark #topX,
.dark #topXAllTime {
    color: #f7f9fc;
}

#topX ol,
#topX ul,
#topXAllTime ol,
#topXAllTime ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#topX li,
#topXAllTime li {
    font-size: 0.875rem;
    color: #1a202c;
}

.dark #topX li,
.dark #topXAllTime li {
    color: #f7f9fc;
}

#topX .x-value,
#topXAllTime .x-value {
    color: #00a83e;
    font-weight: 600;
}

.dark #topX .x-value,
.dark #topXAllTime .x-value {
    color: #48bb78;
}

/* Стили для таблицы токенов */
.token-name {
    font-weight: bold;
    font-size: 12px;
}

.token-list {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.token-list::-webkit-scrollbar {
    display: none;
}

.token-header, .token-row {
    display: grid;
    grid-template-columns: 0.5fr 0.5fr 0.5fr 0.5fr 1.5fr 1fr 1fr 0.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 0.5fr 0.5fr 0.5fr;
    align-items: center;
    font-size: 0.875rem;
    text-align: center;
    min-width: 1590px;
    padding: 0.5rem 1rem;
}

.token-header {
    font-weight: 600;
    color: #1c1c1c;
    font-size: 12px;
    border-bottom: 1px solid #e5e7eb;
    background: #edf2f7;
}

.dark .token-header {
    color: #f7f9fc;
    border-bottom: 1px solid #4a5568;
    background: #2d3748;
}

.token-row {
    border-bottom: 1px solid #e5e7eb;
    transition: background 0.2s ease;
    font-size: 13px;
    line-height: 1.425;
    font-weight: 600;
    background: #fff;
    padding: 0.5rem 1rem;
}

.dark .token-row {
    border-bottom: 1px solid #4a5568;
    background: #2d3748;
    padding: 0.5rem 1rem;
}

.token-row:hover {
    background: #f9fafb;
}

.dark .token-row:hover {
    background: #4a5568;
}

.candle-bars {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1px;
}

.candle-bar {
    display: inline-block;
    width: 4px;
    height: 12px;
    border-radius: 1px;
}

.green-bar {
    background-color: #00c087;
}

.dark .green-bar {
    background-color: #48bb78;
}

.red-bar {
    background-color: #ff3860;
}

.dark .red-bar {
    background-color: #fc8181;
}

.token-header div:nth-child(8),
.token-row div:nth-child(8) {
    text-align: center;
    min-width: 80px;
}

.dust-indicator {
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    color: rgb(239, 204, 70);
}

.dark .dust-indicator {
    color: #ecc94b;
}

.token-row.archived .dust-indicator {
    color: #888 !important;
}

.dark .token-row.archived .dust-indicator {
    color: #a0aec0 !important;
}

.token-row.archived-deleted .dust-indicator {
    color: #ff6347 !important;
}

.dark .token-row.archived-deleted .dust-indicator {
    color: #fc8181 !important;
}

.token-row.archived {
    background-color: #f0f0f0;
    opacity: 0.6;
}

.dark .token-row.archived {
    background-color: #4a5568;
    opacity: 0.6;
}

.token-row.archived a {
    
}

.dark .token-row.archived a {
    color: #cbd5e0;
}

.token-row.archived-deleted {
    background-color: rgba(255, 99, 71, 0.1);
    opacity: 0.6;
}

.dark .token-row.archived-deleted {
    background-color: rgba(252, 129, 129, 0.1);
    opacity: 0.6;
}

.token-row.archived-deleted a {
  
}

.dark .token-row.archived-deleted a {
    color: #feb2b2;
}

.token-row.highlight-green {
    animation: highlightGreen 60s forwards;
}

.dark .token-row.highlight-green {
    animation: highlightGreenDark 60s forwards;
}

@keyframes highlightGreen {
    0% {
        background-color: rgba(0, 200, 0, 0.2);
    }
    100% {
        background-color: transparent;
    }
}

@keyframes highlightGreenDark {
    0% {
        background-color: rgba(72, 187, 120, 0.2);
    }
    100% {
        background-color: transparent;
    }
}

.token-row .max-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
}

.token-row .max-price-x {
    font-size: 1em;
    color: #00a83e;
    margin-top: 2px;
    font-weight: 600;
}

.dark .token-row .max-price-x {
    color: #48bb78;
}

.trend-position {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.trend-position-active {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    background: #11d3bb;
    border-radius: 20px;
    padding: 3px 5px;
    width: 24px;
}

.dark .trend-position-active {
    background: #2f855a;
}

.trend-position-active:hover {
    background: #11f5d9;
}

.dark .trend-position-active:hover {
    background: #38a169;
}

.trend-position-history {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #a0a0a0;
    cursor: pointer;
}

.dark .trend-position-history {
    background-color: #718096;
}

.trend-position-history:hover {
    background-color: #e5e5e5;
}

.dark .trend-position-history:hover {
    background-color: #a0aec0;
}

.trend-position-no-history {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ff3860;
}

.dark .trend-position-no-history {
    background-color: #fc8181;
}

.dex {
    font-size: 10px;
    font-weight: 600;
    color: #666262;
}

.dark .dex {
    color: #a0aec0;
}

.dex a {
    font-size: 10px;
    font-weight: 600;
}

.text-blue-600 {
    font-size: 12px;
}

.dark .text-blue-600 {
    color: #63b3ed !important;
}

.token-name a.highlight-red {
    color: red !important;
    font-weight: 600;
}

.dark .token-name a.highlight-red {
    color: #fc8181 !important;
}

.had-website {
    font-size: 20px;
    font-weight: bold;
}

.contract-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.contract-container {
    display: flex;
    align-items: center;
    background: #f1f3f5;
    border-radius: 4px;
    padding: 2px 6px;
    line-height: 1.2;
    max-width: 100%;
    box-sizing: border-box;
    width: 110px;
}

.dark .contract-container {
    background: #4a5568;
}

.contract-container a {
    color: #2563eb;
    text-decoration: none;
    margin-right: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex-grow: 1;
}

.dark .contract-container a {
    color: #63b3ed;
}

.token-row.archived .contract-container,
.token-row.archived-deleted .contract-container {
    background: #f9f9f9;
    width: 110px;
    opacity: 1 !important;
}

.dark .token-row.archived .contract-container,
.dark .token-row.archived-deleted .contract-container {
    background: #718096;
}

.contract-divider {
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #d1d5db;
    margin: 0 6px;
}

.dark .contract-divider {
    background: #718096;
}

.copy-icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    stroke: #6b7280;
    transition: stroke 0.2s ease;
    position: relative;
    z-index: 10;
    opacity: 1 !important;
}

.dark .copy-icon {
    stroke: #a0aec0;
}

.token-row .contract-container .copy-icon:hover {
    stroke: #2563eb !important;
}

.dark .token-row .contract-container .copy-icon:hover {
    stroke: #63b3ed !important;
}

.h-4 {
    height: 20px !important;
}

.h-4:hover {
    stroke: #2563eb !important;
}

.dark .h-4:hover {
    stroke: #63b3ed !important;
}

.w-4 {
    height: 1.3rem !important;
    stroke: #817f7f;
}

.dark .w-4 {
    stroke: #a0aec0;
}

.token-row.archived .copy-icon,
.token-row.archived-deleted .copy-icon {
    opacity: 1 !important;
}

/* Стили для интерактивных элементов */
.token-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    cursor: pointer;
}

.token-icon:hover::after {
    content: attr(title);
    position: absolute;
    background: #333;
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 10;
    font-size: 12px;
}

.dark .token-icon:hover::after {
    background: #4a5568;
    color: #f7f9fc;
}

.button {
    background: #1a56db;
    color: white;
    padding: 5px;
    border-radius: 5px;
    transition: background 0.2s ease;
    text-align: center;
    font-size: 0.75rem;
    display: inline-block;
}

.dark .button {
    background: #2c5282;
}

.button:hover {
    background: #1545b5;
}

.dark .button:hover {
    background: #2b6cb0;
}

#action-select {
    background: #f1f3f5;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 5px;
}

.dark #action-select {
    background: #2d3748;
    color: #f7f9fc;
    border: 1px solid #4a5568;
}

.token-checkbox,
#select-all-tokens {
    cursor: pointer;
}

.dragging {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

/* Стили для страницы графического ключа */
.access-container {
    max-width: 400px;
    margin: 0 auto;
    padding: 2rem;
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.dark .access-container {
    background: #2d3748;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

#lock-canvas {
    background: #f1f3f5;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    touch-action: none;
}

.dark #lock-canvas {
    background: #4a5568;
    border: 1px solid #718096;
}

.access-error {
    color: #ff3860;
    font-size: 0.75rem;
    text-align: center;
    margin-bottom: 1rem;
}

.dark .access-error {
    color: #fc8181;
}

/* Стили для кнопки выхода */
.logout-button {
    background: #ff3860;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: background 0.2s ease;
}

.dark .logout-button {
    background: #e53e3e;
}

.logout-button:hover {
    background: #e02e50;
}

.dark .logout-button:hover {
    background: #c53030;
}

/* Стили для кнопки История токенов */
.history-button {
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: background 0.2s ease;
}

.dark .history-button {
    background: #2c5282;
}

.history-button:hover {
    background: #e02e50;
}

.dark .history-button:hover {
    background: #c53030;
}

/* Стили для страницы пропущенных сигналов (rejected_signals.php) */
.rejected-signal-list {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.rejected-signal-list::-webkit-scrollbar {
    display: none;
}

.rejected-signal-header {
    display: grid;
    grid-template-columns: 0.5fr 0.5fr 0.5fr 0.5fr 1.5fr 1fr 1fr 0.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 0.5fr 0.5fr 0.5fr 1.5fr;
    padding: 0.5rem;
    align-items: center;
    font-size: 12px;
    text-align: center;
    min-width: 600px;
    font-weight: 600;
    color: #1c1c1c;
    border-bottom: 1px solid #e5e7eb;
    background: #edf2f7;
}

.dark .rejected-signal-header {
    color: #f7f9fc;
    border-bottom: 1px solid #4a5568;
    background: #2d3748;
}

.rejected-signal-row {
    display: grid;
    grid-template-columns: 0.5fr 0.5fr 0.5fr 0.5fr 1.5fr 1fr 1fr 0.5fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 0.5fr 0.5fr 0.5fr 1.5fr;
    padding: 0.5rem;
    align-items: center;
    font-size: 0.875rem;
    text-align: center;
    min-width: 600px;
    border-bottom: 1px solid #e5e7eb;
    transition: background 0.2s ease;
    background: #fff;
}

.dark .rejected-signal-row {
    border-bottom: 1px solid #4a5568;
    background: #2d3748;
}

.rejected-signal-row:nth-child(even) {
    background: #f7fafc;
}

.dark .rejected-signal-row:nth-child(even) {
    background: #4a5568;
}

.rejected-signal-row:hover {
    background: #f9fafb;
}

.dark .rejected-signal-row:hover {
    background: #718096;
}

.reasons-details {
    display: grid;
    grid-template-columns: 1fr;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease-out;
    justify-items: end;
}

.reasons-details:not(.hidden) {
    max-height: 200px; /* Достаточно для большинства списков причин */
}

.dark .reasons-details {
    background: #4a5568;
}

.reasons-content {
    padding: 0.5rem 1rem;
    text-align: right; /* Выравнивание по правому краю */
}

.reasons-list {
    list-style-position: inside;
    padding: 0;
    margin: 0;
    font-size: 0.75rem;
    color: #1a202c;
    max-width: 600px; /* Ограничение ширины для читаемости */
    margin-left: auto; /* Прижимаем к правому краю */
}

.dark .reasons-list {
    color: #f7f9fc;
}

.reasons-list li {
    margin-bottom: 0.5rem;
    text-align: left; /* Текст внутри li выравнивается по левому краю для читаемости */
}

.no-signals {
    text-align: center;
    padding: 20px;
    font-style: italic;
    color: #718096;
    font-size: 0.875rem;
}

.dark .no-signals {
    color: #a0aec0;
}

.footer-link-rejected {
    display: block;
    text-align: center;
    margin-top: 20px;
    font-size: 0.875rem;
}

.back-link-rejected {
    display: inline-block;
    margin-bottom: 20px;
    padding: 8px 15px;
    background-color: #4A5568;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-size: 0.9rem;
    transition: background 0.2s ease;
}

.dark .back-link-rejected {
    background-color: #2d3748;
}

.back-link-rejected:hover {
    background-color: #2D3748;
}

.dark .back-link-rejected:hover {
    background-color: #4a5568;
}

/* Стили для карточек (card) */
.card {
    width: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    font-size: 14px;
    font-weight: 600;
}

.dark .card {
    width: 100%;
    background: #2d3748;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.dark .bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(126 136 153);
}

.dark .bg-gray-100 {
    background: #4a5568;
}

.dark .border-b {
    border-color: #4a5568;
}

.dark .text-gray-600 {
    color: #a0aec0;
}

/* Стили для колонок market_cap */
.initial-cap, .current-cap, .max-cap {
    text-align: center;
    font-size: 12px;
}

.max-cap {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.max-cap-x {
    font-size: 12px;
    color: #00a83e;
    margin-top: 2px;
    font-weight: 600;
}

.dark .max-cap-x {
    color: #48bb78;
}

/* Стили для графика истории иксов (canvas) */
#xHistoryChart {
    background-color: #ffffff;
}

.dark #xHistoryChart {
    background-color: transparent !important;
}

/* Стили для tooltips Chart.js */
.chartjs-tooltip {
    background-color: #ffffff;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 10px;
    font-size: 12px;
}

.dark .chartjs-tooltip {
    background-color: #2d3748 !important;
    color: #ffffff !important;
    border: 1px solid #718096 !important;
}

/* Явное определение цветов для совместимости */
.text-green-600 {
    color: #34D399;
}

.dark .text-green-600 {
    color: #48BB78;
}

.text-red-600 {
    color: #F87171;
}

.dark .text-red-600 {
    color: #F56565;
}

.def {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.425;
}

.signal-number {
    font-size: 13px;
    line-height: 1.425;
    font-weight: 600;
}

/* Стили для раскрывающегося переключателя причин */
.reason-cell {
    word-break: break-word;
    overflow: visible;
    white-space: normal;
    padding: 2px;
}

.reason-toggle {
    cursor: pointer;
    color: #1a202c;
    background: #f1f3f5;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1.2;
    max-width: 100%;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 600;
}

.dark .reason-toggle {
    color: #ffffff;
    background: #344869;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1.2;
    max-width: 100%;
    box-sizing: border-box;
    font-weight: 600;
}

.reason-toggle:hover {
    background: #e2e8f0;
}

.dark .reason-toggle:hover {
    background: #4a5568;
}

.reason-arrow {
    stroke: #6b7280;
    transition: transform 0.3s ease;
}

.dark .reason-arrow {
    stroke: #a0aec0;
}

.reasons-details:not(.hidden) + .reason-arrow {
    transform: rotate(180deg);
}

.reason-toggle:hover .reason-arrow {
    stroke: #2563eb;
}

.dark .reason-toggle:hover .reason-arrow {
    stroke: #63b3ed;
}

/* Адаптивные стили */
@media (min-width: 1700px) {
    .container {
        max-width: 1720px;
    }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-3 {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1024px) {
    .token-header,
    .token-row {
        font-size: 0.875rem;
    }
    .rejected-signal-header,
    .rejected-signal-row {
        min-width: 500px;
        font-size: 0.75rem;
    }
}

@media (max-width: 640px) {
    .container {
        padding: 0.5rem;
    }
    .settings-panel {
        flex-direction: column;
        align-items: flex-start;
    }
    .settings-panel select,
    .settings-panel input {
        width: 100%;
    }
    .settings-panel .container-flex {
        flex-direction: column;
        align-items: flex-start;
    }
    .settings-panel .flex.items-center.ml-auto {
        margin-left: 0;
        margin-top: 0.5rem;
    }
    .token-header,
    .token-row {
        grid-template-columns: repeat(8, minmax(0, 1fr));
        min-width: 650px;
        font-size: 0.75rem;
    }
    .token-header div:nth-child(n+9),
    .token-row div:nth-child(n+9) {
        display: none;
    }
    .token-header div:nth-child(1),
    .token-header div:nth-child(2),
    .token-header div:nth-child(3),
    .token-header div:nth-child(4),
    .token-header div:nth-child(5),
    .token-header div:nth-child(6),
    .token-header div:nth-child(7),
    .token-header div:nth-child(8),
    .token-row div:nth-child(1),
    .token-row div:nth-child(2),
    .token-row div:nth-child(3),
    .token-row div:nth-child(4),
    .token-row div:nth-child(5),
    .token-row div:nth-child(6),
    .token-row div:nth-child(7),
    .token-row div:nth-child(8) {
        display: block;
    }
    .rejected-signal-header,
    .rejected-signal-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-width: 400px;
        font-size: 0.675rem;
    }
    .rejected-signal-header div:nth-child(3),
    .rejected-signal-header div:nth-child(4),
    .rejected-signal-row div:nth-child(3),
    .rejected-signal-row div:nth-child(4) {
        display: none;
    }
    .reasons-details:not(.hidden) {
        max-height: 300px; /* Увеличено для мобильных, чтобы вместить длинные списки */
    }
    .reasons-list {
        max-width: 100%; /* Полная ширина на мобильных для читаемости */
    }
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: 0;
}

.filter_close {
    --tw-text-opacity: 1;
    color: #fff;
    background-color: #ff3860;
    padding: 4px 8px;
    border-radius: 5px;
}

.dark .filter_close {
    background-color: #e53e3e;
}

.filter_close:hover {
    background-color: #df3c3c;
}

.dark .filter_close:hover {
    background-color: #c53030;
}

.token-count {
    font-weight: 600;
}

/* Стили для всплывающего окна */
#trend-history-modal {
    transition: opacity 0.3s ease;
}

#trend-history-modal.hidden {
    opacity: 0;
    pointer-events: none;
}

#trend-history-modal .bg-white {
    max-height: 80vh;
    overflow-y: auto;
}

.dark #trend-history-modal .bg-white {
    background: rgb(126 136 153);
    --tw-bg-opacity: 1;
}

/* Стили для таблицы */
#trend-history-table tr:hover {
    background-color: #f9fafb;
}

.dark #trend-history-table tr:hover {
    background-color: #4a5568;
}

.dark #trend-chart-container {
   
}

#trend-chart {
    max-height: 300px;
}

.dark #trend-chart {
    color: #f7f9fc !important;
}

.dark #trend-chart .chartjs-render-monitor {
    color: #f7f9fc !important;
}

.dark #xHistoryChart,
.dark #xHistoryChart .chartjs-render-monitor {
    color: #f7f9fc !important;
}

/* Стили для выпадающего списка интервалов */
#trend-interval {
    background: #f1f3f5;
    color: #1a202c;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

.dark #trend-interval {
    background: #4a5568;
    color: #f7f9fc;
    border: 1px solid #718096;
}

#domain-filter, #domain-filter-buy {
    width: 150px;
}

.link-icon {
    display: inline-block;
    cursor: pointer;
}

.link-icon img {
    width: 15px;
    height: 15px;
    transition: opacity 0.2s;
    margin-left: 5px;
    border-radius: 5px;
}

.link-icon:hover img {
    opacity: 0.8;
}

.contract-container-r {
    display: flex;
    align-items: center;
    background: #f1f3f5;
    border-radius: 4px;
    padding: 2px 6px;
    line-height: 1.2;
    max-width: 100%;
    box-sizing: border-box;
}

.dark .contract-container-r {
    background: #344869;
}

.contract-address {
    width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #2563eb;
    font-size: 12px;
}

.dark .contract-address {
    color: #63b3ed;
}

/* Стили для вкладок */
.tab-link, .x-history {
    display: inline-block;
    padding: 0.5rem 1rem; /* px-4 py-2 */
    background: #1a56db; /* bg-blue-500 */
    color: #fff; /* text-white */
    border-radius: 5px; /* rounded */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    text-decoration: none;
    transition: background 0.2s ease;
}

.dark .tab-link, .x-history {
    background: #2c5282; /* Более темный синий для темного режима */
    color: #f7f9fc;
}

.tab-link:hover {
    background: #38a169;
}

.dark .tab-link:hover {
    background: #38a169;
}

.tab-link.active {
    background: #38a169; /* Выделение активной вкладки */
    color: #fff;
    font-weight: 600;
}

.dark .tab-link.active {
    background: #38a169; /* Зеленый акцент для активной вкладки в темной теме */
    color: #fff;
    font-weight: 600;
}

.nav-tabs {
    border-bottom: 1px solid #d1d5db;
}

.nav-link {
    padding: 0.5rem 1rem;
    color: #4b5563;
    cursor: pointer;
}

.nav-link.active {
    color: #2563eb;
    border-bottom: 2px solid #2563eb;
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}

/* Стили для блока настроек закупа токенов */
.purchase-settings {
    padding: 1rem;
    background-color: #ffffff;
}

.dark .purchase-settings {
    background-color: #2d3748;
    box-shadow: none;
}

/* Контейнер для строки настроек */
.purchase-settings .setting-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
}

/* Стили для полей ввода типа number */
.purchase-settings input[type="number"] {
    max-width: 100%;
    padding-left: 1rem;
    text-align: center;
}

/* Удаляем границы и задаём минимальную подкладку для конкретных полей */
#purchase-amount-usd, #fee {
    border-width: 0;
    padding: 0.1rem;
    width: 120px;
}

/* Стили для переключателя */
.purchase-settings .toggle-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
}

.purchase-settings .toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.purchase-settings .toggle-switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.4s;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 15px;
    border-radius: 0.25rem;
}

/* Темная тема для переключателя */
.dark .purchase-settings .toggle-switch .slider {
    background-color: #5f7499;
}

/* Индикатор переключателя */
.purchase-settings .toggle-switch .slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.4s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    z-index: 1;
    border-radius: 0.25rem;
}

.dark .purchase-settings .toggle-switch .slider:before {
    background-color: #e2e8f0;
}

/* Надписи ON/OFF */
.purchase-settings .toggle-switch .slider:after {
    content: attr(data-off);
    position: absolute;
    left: 6px;
    font-size: 0.75rem;
    color: #666;
    transition: opacity 0.4s;
    z-index: 2; /* Над индикатором */
}

.purchase-settings .toggle-switch input:checked + .slider:after {
    content: attr(data-on);
    left: auto;
    right: 6px;
    color: #fff; /* Белый текст для видимости на фоне */
}

.dark .purchase-settings .toggle-switch .slider:after {
    color: #a0aec0;
}

.dark .purchase-settings .toggle-switch input:checked + .slider:after {
    color: #fff;
}

/* Состояние включённого переключателя */
.purchase-settings .toggle-switch input:checked + .slider {
    background-color: #38a169; /* Зеленый цвет для ON */
}

.dark .purchase-settings .toggle-switch input:checked + .slider {
    background-color: #38a169; /* Зеленый в темной теме */
}

.purchase-settings .toggle-switch input:checked + .slider:before {
    transform: translateX(16px);
}

/* Стили для кнопки сохранения */
.purchase-settings .save-button {
    background-color: #10b981; /* Зеленый акцент */
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    transition: background-color 0.2s;
    font-weight: 600;
    margin-left: auto; /* Прижатие к правому краю */
}

.dark .purchase-settings .save-button {
    background-color: #38a169; /* Светло-зеленый в темной теме */
}

.purchase-settings .save-button:hover {
    background-color: #059669; /* Темно-зеленый при наведении */
}

.dark .purchase-settings .save-button:hover {
    background-color: #2dd4bf; /* Светло-бирюзовый при наведении в темной теме */
}

/* Адаптивность для мобильных устройств */
@media (max-width: 640px) {
    .purchase-settings .setting-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .purchase-settings input[type="number"] {
        width: 100%;
    }

    .purchase-settings .save-button {
        width: 100%;
        margin-left: 0; /* Снимаем прижатие на мобильных */
    }
}

.source {
    min-width: 30px;  /* Минимальная ширина, чтобы колонка не съезжала (немного больше w-5=20px для отступов) */
    min-height: 20px;  /* Высота иконки */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.75rem;  /* Для текста 'N/A' */
}

.dark .source {
    color: #a0aec0;  /* В темной теме */
}

/* Для текста 'N/A' без иконки */
.source:not(:has(img)) {
    color: #6b7280;  /* Серый для N/A */
}

.dark .source:not(:has(img)) {
    color: #9ca3af;
}

.source-placeholder {
    min-width: 20px;
    display: inline-block;
    text-align: center;
    color: #6b7280;
}

/* Аккордеон: построчный вывод параметров */

.token-details--stacked {
    display: block;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 1.4;
    background: #edf2f7;
}

.dark .token-details--stacked {
    display: block;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 1.4;
    background: #212834;
}

.token-details--stacked .kv-row {
    gap: 8px;
    flex-wrap: wrap;
    margin: 6px 0;
}

.token-details--stacked .kv-label {
  min-width: 110px;             /* ширина колонки "ключ" */
  font-weight: 600;
  color: #6b7280;
  text-align: left;
}

.dark .token-details--stacked .kv-label {
  color: #a0aec0;
}

.token-details--stacked .kv-value {
  flex: 1;
  word-break: break-all;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

/* ссылка-хеш + иконка копирования */
.token-details--stacked .tx-link {
    text-decoration: none;
    color: #3687e3;
}

.token-details--stacked .tx-link:hover {
  border-bottom-style: solid;
}

.token-details--stacked .txstatus{ text-transform: uppercase; }

.token-details--stacked .copy-icon {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity .15s ease, transform .15s ease;
}

.token-details--stacked .copy-icon.copied {
  opacity: 1;
  transform: scale(1.05);
}