/* Базовые стили */
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;
}

/* Пример, если у заголовка есть селектор .page-title (подставьте свой) */
.page-title{
  font-size:0; line-height:0; color:transparent;
  width: fit-content;
  margin-left: 10px;
}
.page-title::before{
  content:"";
  display:inline-block;
  height:40px; aspect-ratio: 979/399;
  background-repeat:no-repeat; background-size:contain; background-position:left center;
  background-image: image-set(
    url("/images/logo-light.png")
  );
}
.dark .page-title::before{
  background-image: image-set(
    url("/images/logo-dark.png")
  );
}

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

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

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

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 .2s ease;text-align:center;font-size:14px;
  cursor:pointer;font-weight:600
}
.filter-button:hover{background:#1545b5}
.dark .filter-button{background:#2c5282}
.dark .filter-button:hover{background:#2b6cb0}

/* ===== Базовые переменные для панелей фильтра ===== */
.filter-dropdown, .rejected-filter-dropdown{
  --gap:12px;--gap-lg:16px;--field-h:36px;--radius:8px;
  --border:#d1d5db;--bg:#fff;--muted:#6b7280;--text:#1a202c;

  background:var(--bg);border:1px solid var(--border);border-radius:8px;
  box-shadow:0 2px 8px rgba(0,0,0,.15);padding:16px 18px 12px;z-index:1000;
  min-width:280px;width:clamp(680px,70vw,980px);
  max-width:95vw;max-height:85vh;overflow:auto;box-sizing:border-box
}
.filter-title{margin-bottom: 10px;}

/* Позиционирование: основная — по центру экрана */
.filter-dropdown{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)
}
/* Окно отклонённых — как было (якорное положение) */
.rejected-filter-dropdown{
  position:absolute;top:33%;right:131px
}

/* Тёмная тема для обеих панелей */
.dark .filter-dropdown, .dark .rejected-filter-dropdown{
  --border:#4a5568;--bg:#2d3748;--muted:#a0aec0;--text:#f7f9fc;
  box-shadow:0 2px 8px rgba(0,0,0,.3)
}

/* ===== Внутренний лейаут ===== */
.filter-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:var(--gap-lg);align-items:end
}

/* Карточка поля (совместимо с .filter-item) */
.filter-item{
  display:grid;grid-template-rows:auto auto;gap:6px
}
.filter-item label{
  font-size:12px;line-height:1.2;font-weight:600;color:var(--muted);margin:0
}

/* Ряд для диапазонов "от—до" */
.field__row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.field--single .field__row{grid-template-columns:1fr}

/* Унификация input/select */
.filter-dropdown input,.filter-dropdown select,
.rejected-filter-dropdown input,.rejected-filter-dropdown select{
  height:var(--field-h);border-radius:var(--radius);
  border:1px solid var(--border);background:#f1f3f5;color:var(--text);
  font-size:13px;line-height:1.2;padding:0 10px;width:100%;box-sizing:border-box
}
.filter-dropdown input:hover,.filter-dropdown select:hover,
.rejected-filter-dropdown input:hover,.rejected-filter-dropdown select:hover{
  border-color:#bfc6d1
}
.filter-dropdown input:focus,.filter-dropdown select:focus,
.rejected-filter-dropdown input:focus,.rejected-filter-dropdown select:focus{
  outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)
}
.dark .filter-dropdown input,.dark .filter-dropdown select,
.dark .rejected-filter-dropdown input,.dark .rejected-filter-dropdown select{
  background:#344869;border-color:var(--border);color:var(--text)
}
.dark .filter-dropdown input:focus,.dark .filter-dropdown select:focus,
.dark .rejected-filter-dropdown input:focus,.dark .rejected-filter-dropdown select:focus{
  border-color:#63b3ed;box-shadow:0 0 0 3px rgba(99,179,237,.18)
}
.filter-dropdown ::placeholder,.rejected-filter-dropdown ::placeholder{color:#9ca3af}

/* Ряд действий (если используешь кнопки Применить/Сбросить) */
.filter-actions {
    margin-top: 20px;
    padding-top: 11px;
    border-top: 1px solid var(--border);
}
.btn{appearance:none;border:1px solid transparent;border-radius:6px;
  font-weight:600;font-size:13px;line-height:1;padding:9px 12px;cursor:pointer}
.btn-primary{background:#1a56db;color:#fff}
.btn-primary:hover{background:#1545b5}
.btn-ghost{background:transparent;color:#1f2937;border-color:var(--border)}
.btn-ghost:hover{background:#f3f4f6}
.dark .btn-ghost{color:#e2e8f0;border-color:var(--border)}
.dark .btn-ghost:hover{background:rgba(255,255,255,.06)}

.hidden{display:none}

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

.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 0.5fr 1.5fr 1fr 1fr 1fr 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 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 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;
}

.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;
}



.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%;
    text-align: center;
    width: 100px;
}

/* Стили для переключателя */
.purchase-settings .toggle-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    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: 14px;
    width: 14px;
    left: 10px;
    bottom: 5px;
    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);
}

/* tooltip */
.holders-tooltip {
  position: absolute;
  z-index: 50;
  transform: translateY(6px);
  background: #0f172a;           /* тёмно-синий сланейт для тёмной темы */
  color: #fff;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 8px 10px;
  width: 260px;
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
  display: none;
}

.holders-tooltip.visible { display: block; }

.holders-tt .tt-title {
  font-weight: 600;
  margin-bottom: 6px;
  font-size: 12px;
}

.holders-tt .tt-list {
  max-height: 240px;
  overflow: auto;
  padding-right: 4px;
}

.holders-tt .tt-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  line-height: 1.4;
}

.holders-tt .tt-total {
  margin-top: 6px;
  font-size: 12px;
}

.holders-tt .tt-ts {
  margin-top: 4px;
  opacity: .7;
  font-size: 11px;
}

[data-col="holders"], .col-holders, .holders {
  position: relative; /* чтобы tooltip позиционировался от ячейки */
}

#holders-tooltip-root{
  position: fixed;
  z-index: 99999;
  display: none;
  max-width: 320px;
  background: #0f172a;
  color: #fff;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 8px 10px;
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
  pointer-events: auto;
}

.dark #holders-tooltip-root{
  background: #1d2633;
  border-color: rgba(255,255,255,.12);
}

.holders-tooltip__header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
  font-weight:600;
  font-size:12px;
}

.holders-tooltip__title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.holders-tooltip__close{
  appearance:none;
  border:0;
  background:transparent;
  color:#cbd5e1;
  font-size:16px;
  line-height:1;
  cursor:pointer;
  padding:2px 4px;
  border-radius:6px;
}
.holders-tooltip__close:hover{ background:rgba(255,255,255,.06); }

.holders-tooltip__list{
  max-height: 280px;        /* можно скроллить список */
  overflow-y: auto;
  padding-right: 4px;
}

.holders-tooltip__row{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  line-height:1.35;
}

.holders-tooltip__footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-top:6px;
  font-size:12px;
}

.holders-tooltip__timestamp{
  opacity:.7;
  font-size:11px;
  white-space:nowrap;
}

/* ============ Holders: quality chip ============ */
.holders-quality-line{
  margin-top: 4px;
  font-size: 11px;
  line-height: 1;
  opacity: .8;
  cursor: pointer;
  color:#1dd4e9;
  font-weight:bold;
}

/* ============ Holders: floating windows ============ */
.holders-float{
  position: fixed;
  z-index: 20000;                       /* будет повышаться динамически */
  min-width: 280px;
  max-width: 360px;
  background: #ffffff;                  /* light */
  color: #0f172a;
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 10px;
  box-shadow: 0 6px 24px rgba(0,0,0,.25);
  pointer-events: auto;
  user-select: none;
}
.dark .holders-float {
    background: #2d3748;
    color: var(--muted);
    border-color: rgba(255, 255, 255, .12);
    box-shadow: 0 6px 24px rgba(0, 0, 0, .35);
}

.holders-float__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  cursor: move;                         /* drag handle */
}
.dark .holders-float__header{
  border-bottom-color: rgba(255,255,255,.08);
}

.holders-float__title{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:12px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.holders-float__links{
  display:flex;
  align-items:center;
  gap:8px;
}
.holders-float__links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 20px;
  height: 20px;
  border-radius:6px;
  background: transparent;
}
.holders-float__links img{ width: 16px; height: 16px; display:block; }

.holders-float__close{
  appearance:none;
  border:0;
  background:transparent;
  color: inherit;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  padding: 2px 6px;
  border-radius:6px;
  margin-left: 4px;
}
.holders-float__close:hover{
  background: rgba(0,0,0,.06);
}
.dark .holders-float__close:hover{
  background: rgba(255,255,255,.08);
}

.holders-float__body{
  padding: 8px 10px;
  user-select: text;
}

.holders-float__list{
  max-height: 300px;      /* скролл внутри окна */
  overflow-y: auto;
  padding-right: 4px;
}

.holders-float__row{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  line-height:1.35;
}

.holders-float__footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-top:6px;
  font-size:12px;
  opacity:.9;
}

.holders-float__ts{
  opacity:.7;
  font-size:11px;
  white-space:nowrap;
}

/* ===== Holders floating: 3-column table ===== */
.holders-float__table {
  display: grid;
  grid-template-columns: 20px 1fr 1fr;
  gap: 4px 10px;
  font-size: 12px;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
  justify-content: start;
  justify-items: end;
}
.holders-float__th{
  opacity:.75;
  font-weight:700;
}
.holders-float__cell{
  white-space:nowrap;
  text-overflow:ellipsis;
}
.holders-float__cell--num{
  text-align:right;
}

/* Внутри таблицы окна холдеров используем «виртуальные» строки */
.holders-float__table .holders-float__row {
  display: contents; /* дети-ячейки остаются grid-элементами */
}

/* Подсветка всей строки, если это кит */
.holders-float__table .holders-float__row.is-whale > .holders-float__cell {
  background: #ebac14;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
  cursor: help; /* есть title: «Кит: …» */
}


/* Подсветка строк с китами */
.holders-float__row.is-whale > .holders-float__cell {
  background: #fff8cf;          /* бледно-жёлтый */
}

/* Чуть-чуть визуального разделения без «прыжков» */
.holders-float__row.is-whale > .holders-float__cell {
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
}

/* уже было — подсветка whale-строк */
.holders-float__row { 
  display: contents;
}

.holders-float__row.is-whale > .holders-float__cell {
  background: #fff8cf;                 /* бледно-жёлтый */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.04);
  cursor: help;                         /* видно, что есть подсказка */
}

.holders-float__cell a {
    text-decoration: none;
    border-bottom: 1px dotted #cecece;
}

.holders-float__cell a:hover {
  border-bottom-color: #625d5d;
}

.holders-quality-line.has-whale {

  border-radius: 4px;
  padding: 4px;
  box-shadow: 0 0 0 1px #f0d58a inset; /* лёгкий золотистый кант */
}

.status-pill {
  display: inline-block;
  border-radius: 6px;
  font-weight: 600;
}

.status-success { color: #16a34a; } /* зелёный */
.status-pending { color: #ca8a04; } /* жёлтый */
.status-error   { color: #dc2626; } /* красный */