/* ═══════════════════════════════════════════════════════════════
   BUMAGA — Trust Search Widget
   Location: /assets/css/trust-search.css
   ═══════════════════════════════════════════════════════════════

   Reusable widget: единый поиск по Scam List + Red Flag + Disputes.
   Подключается через includes/trust-search-widget.php

   Namespace: trs-*
   Dependencies: tokens.css (--bp-* variables)
   ═══════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════
   SECTION WRAPPER
   ══════════════════════════════════════════════════════════════ */

.trs-section {
    margin: 48px 0;
}

.trs-section-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--bp-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    text-align: center;
    margin-bottom: 12px;
}

.trs-section-title {
    font-size: 28px;
    font-weight: 800;
    color: var(--bp-text);
    text-align: center;
    margin-bottom: 8px;
    line-height: 1.2;
}

.trs-section-sub {
    font-size: 14px;
    color: var(--bp-text-secondary);
    text-align: center;
    margin-bottom: 28px;
    line-height: 1.5;
}


/* ══════════════════════════════════════════════════════════════
   SEARCH INPUT ROW
   ══════════════════════════════════════════════════════════════ */

.trs-search-wrap {
    max-width: 640px;
    margin: 0 auto 28px;
}

.trs-search-row {
    display: flex;
    gap: 10px;
    align-items: stretch;
}

.trs-search-field {
    width: 100%;
    background: var(--bp-card);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-sm);
    padding: 0 16px;
    height: 48px;
    font-size: 14px;
    color: var(--bp-text);
    font-family: var(--bp-sans);
    outline: none;
    transition: border-color var(--bp-transition-fast);
    min-width: 0;
    box-sizing: border-box;
}

.trs-search-field::placeholder {
    color: var(--bp-text-muted);
}

.trs-search-field:focus {
    border-color: var(--bp-accent-border-strong);
}

.trs-search-btn {
    height: 48px;
    padding: 0 22px;
    background: var(--bp-accent);
    border: none;
    border-radius: var(--bp-radius-sm);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: var(--bp-sans);
    cursor: pointer;
    white-space: nowrap;
    transition: opacity var(--bp-transition-fast);
    flex-shrink: 0;
}

.trs-search-btn:hover {
    opacity: 0.88;
}

.trs-search-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.trs-search-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.trs-search-hint-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--bp-text-muted);
}

.trs-search-hint-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.trs-search-hint-dot--scam     { background: var(--bp-red); }
.trs-search-hint-dot--redflag  { background: var(--bp-orange); }
.trs-search-hint-dot--disputes { background: var(--bp-accent); }


/* ══════════════════════════════════════════════════════════════
   STATES: IDLE / LOADING / EMPTY / RESULTS
   ══════════════════════════════════════════════════════════════ */

.trs-state {
    display: none;
    max-width: 640px;
    margin: 0 auto;
}

.trs-state--active {
    display: block;
}

/* Loading */
.trs-loading {
    text-align: center;
    padding: 32px 0;
}

.trs-loading-dots {
    display: inline-flex;
    gap: 6px;
    align-items: center;
}

.trs-loading-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--bp-accent);
    opacity: 0.3;
    animation: trsLoadPulse 1.2s ease-in-out infinite;
}

.trs-loading-dot:nth-child(2) { animation-delay: 0.2s; }
.trs-loading-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes trsLoadPulse {
    0%, 100% { opacity: 0.2; transform: scale(0.85); }
    50%       { opacity: 1;   transform: scale(1); }
}

.trs-loading-text {
    margin-top: 12px;
    font-size: 13px;
    color: var(--bp-text-muted);
}

/* Empty / not found */
.trs-empty {
    text-align: center;
    padding: 28px 0;
}

.trs-empty-icon {
    font-size: 32px;
    margin-bottom: 10px;
    line-height: 1;
}

.trs-empty-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--bp-green);
    margin-bottom: 6px;
}

.trs-empty-sub {
    font-size: 13px;
    color: var(--bp-text-muted);
}


/* ══════════════════════════════════════════════════════════════
   RISK BANNER — summary когда найден юзер
   ══════════════════════════════════════════════════════════════ */

.trs-risk-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: var(--bp-card);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    padding: 16px 20px;
    margin-bottom: 12px;
}

.trs-risk-left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.trs-risk-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    flex-shrink: 0;
    font-family: var(--bp-mono);
    border: 1.5px solid;
}

.trs-risk-avatar--danger {
    background: var(--bp-red-dim);
    border-color: var(--bp-red);
    color: var(--bp-red);
}

.trs-risk-avatar--warning {
    background: var(--bp-orange-dim);
    border-color: var(--bp-orange);
    color: var(--bp-orange);
}

.trs-risk-avatar--safe {
    background: var(--bp-green-dim);
    border-color: var(--bp-green);
    color: var(--bp-green);
}

.trs-risk-name {
    font-size: 15px;
    font-weight: 700;
    color: var(--bp-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.trs-risk-meta {
    font-size: 12px;
    color: var(--bp-text-muted);
    margin-top: 2px;
}

.trs-risk-badge {
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid;
}

.trs-risk-badge--high {
    background: var(--bp-red-dim);
    border-color: rgba(248, 113, 113, 0.25);
    color: var(--bp-red);
}

.trs-risk-badge--medium {
    background: var(--bp-orange-dim);
    border-color: rgba(251, 191, 36, 0.25);
    color: var(--bp-orange);
}

.trs-risk-badge--low {
    background: var(--bp-accent-dim);
    border-color: var(--bp-accent-border);
    color: var(--bp-accent);
}


/* ══════════════════════════════════════════════════════════════
   SOURCE ROWS — результат по каждому реестру
   ══════════════════════════════════════════════════════════════ */

.trs-sources {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.trs-source-row {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--bp-card);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-sm);
    padding: 14px 18px;
    text-decoration: none;
    transition: border-color var(--bp-transition-fast),
                background   var(--bp-transition-fast);
    cursor: pointer;
    border-left: 3px solid transparent;
}

.trs-source-row:hover {
    background: var(--bp-card-hover);
    border-color: var(--bp-border-hover);
}

/* Цветная левая полоска по источнику */
.trs-source-row--scam     { border-left-color: var(--bp-red); }
.trs-source-row--redflag  { border-left-color: var(--bp-orange); }
.trs-source-row--disputes { border-left-color: var(--bp-accent); }

/* Источник без результатов — приглушён */
.trs-source-row--zero {
    opacity: 0.45;
    cursor: default;
    pointer-events: none;
}

.trs-source-icon {
    width: 32px;
    height: 32px;
    border-radius: var(--bp-radius-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.trs-source-icon--scam     { background: var(--bp-red-dim); }
.trs-source-icon--redflag  { background: var(--bp-orange-dim); }
.trs-source-icon--disputes { background: var(--bp-accent-dim); }

.trs-source-icon svg {
    width: 16px;
    height: 16px;
}

.trs-source-icon--scam     svg { color: var(--bp-red); }
.trs-source-icon--redflag  svg { color: var(--bp-orange); }
.trs-source-icon--disputes svg { color: var(--bp-accent); }

.trs-source-body {
    flex: 1;
    min-width: 0;
}

.trs-source-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--bp-text);
    margin-bottom: 2px;
}

.trs-source-desc {
    font-size: 12px;
    color: var(--bp-text-muted);
}

.trs-source-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.trs-source-count {
    font-size: 20px;
    font-weight: 800;
    font-family: var(--bp-mono);
    min-width: 28px;
    text-align: right;
    line-height: 1;
}

.trs-source-count--scam     { color: var(--bp-red); }
.trs-source-count--redflag  { color: var(--bp-orange); }
.trs-source-count--disputes { color: var(--bp-accent); }
.trs-source-count--zero     { color: var(--bp-text-muted); }

.trs-source-arrow {
    width: 18px;
    height: 18px;
    color: var(--bp-text-muted);
    flex-shrink: 0;
    transition: transform var(--bp-transition-fast),
                color     var(--bp-transition-fast);
}

.trs-source-row:hover .trs-source-arrow {
    transform: translateX(3px);
    color: var(--bp-text-secondary);
}


/* ══════════════════════════════════════════════════════════════
   COMPACT MODE — для сайдбара / OTC listing
   ══════════════════════════════════════════════════════════════ */

.trs-compact {
    background: var(--bp-card);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    padding: 14px 16px;
}

.trs-compact-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--bp-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 10px;
}

.trs-compact-row {
    display: flex;
    gap: 8px;
}

.trs-compact-field {
    flex: 1;
    background: var(--bp-surface);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius-xs);
    padding: 0 12px;
    height: 38px;
    font-size: 13px;
    color: var(--bp-text);
    font-family: var(--bp-sans);
    outline: none;
    transition: border-color var(--bp-transition-fast);
    min-width: 0;
}

.trs-compact-field::placeholder {
    color: var(--bp-text-muted);
}

.trs-compact-field:focus {
    border-color: var(--bp-accent-border-strong);
}

.trs-compact-btn {
    height: 38px;
    padding: 0 14px;
    background: var(--bp-accent-dim);
    border: 1px solid var(--bp-accent-border);
    border-radius: var(--bp-radius-xs);
    color: var(--bp-accent);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--bp-sans);
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--bp-transition-fast),
                border-color var(--bp-transition-fast);
    flex-shrink: 0;
}

.trs-compact-btn:hover {
    background: rgba(74, 158, 255, 0.2);
    border-color: var(--bp-accent-border-strong);
}

.trs-compact-sources {
    display: flex;
    gap: 10px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.trs-compact-source-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--bp-text-muted);
}

.trs-compact-source-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.trs-compact-source-dot--scam     { background: var(--bp-red); }
.trs-compact-source-dot--redflag  { background: var(--bp-orange); }
.trs-compact-source-dot--disputes { background: var(--bp-accent); }



/* ══════════════════════════════════════════════════════════════
   RISK SCAN ENGINE — motion block
   Namespace: trs-scan-*
   ══════════════════════════════════════════════════════════════ */

.trs-scan {
    max-width: 600px;
    margin: 0 auto 24px;
    opacity: 0.42;
    user-select: none;
    pointer-events: none;
    transition: opacity var(--bp-transition);
}

.trs-scan--hidden {
    display: none;
}

/* Username */
.trs-scan-username {
    font-size: 12px;
    font-weight: 700;
    font-family: var(--bp-mono);
    color: var(--bp-text-secondary);
    margin-bottom: 12px;
    letter-spacing: 0.3px;
}

/* Micro-text "Scanning registries..." */
.trs-scan-caption {
    font-size: 10px;
    color: var(--bp-text-muted);
    letter-spacing: 0.4px;
    margin-bottom: 10px;
    opacity: 0.6;
}

/* Rows container */
.trs-scan-rows {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin-bottom: 14px;
}

/* Single row */
.trs-scan-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Label — левая колонка */
.trs-scan-row-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--bp-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    width: 68px;
    flex-shrink: 0;
}

/* Track — тонкая линия между label и статусом */
.trs-scan-row-track {
    flex: 1;
    height: 2px;
    background: var(--bp-border);
    position: relative;
    overflow: hidden;
    border-radius: 2px;
}

/* Sweep — скрыт по умолчанию */
.trs-scan-row-sweep {
    display: none;
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--bp-accent) 50%,
        transparent 100%
    );
    background-size: 40% 100%;
    background-repeat: no-repeat;
    background-position: -40% 0;
}

/* Sweep активен только во время сканирования */
.trs-scan-row--scanning .trs-scan-row-sweep {
    display: block;
    animation: trsScanSweep 1.4s ease-in-out infinite;
}

@keyframes trsScanSweep {
    0%   { background-position: -40% 0; }
    100% { background-position: 140% 0; }
}

/* Трек меняет цвет при результате — без fill-анимации, всегда полная линия */
.trs-scan-row--clean   .trs-scan-row-track { background: var(--bp-green);  opacity: 0.55; }
.trs-scan-row--flagged .trs-scan-row-track { background: var(--bp-orange); opacity: 0.55; }
.trs-scan-row--listed  .trs-scan-row-track { background: var(--bp-red);    opacity: 0.55; }

/* Status — правая колонка */
.trs-scan-row-status {
    font-size: 11px;
    font-weight: 600;
    font-family: var(--bp-mono);
    width: 70px;
    text-align: right;
    flex-shrink: 0;
    transition: color var(--bp-transition-fast);
    letter-spacing: 0.2px;
}

.trs-scan-row--scanning .trs-scan-row-status { color: var(--bp-text-muted); opacity: 1; }
.trs-scan-row--clean    .trs-scan-row-status { color: var(--bp-green);  opacity: 0.65; }
.trs-scan-row--flagged  .trs-scan-row-status { color: var(--bp-orange); opacity: 0.65; }
.trs-scan-row--listed   .trs-scan-row-status { color: var(--bp-red);    opacity: 0.65; }

/* Footer — счётчик */
.trs-scan-footer {
    font-size: 11px;
    color: var(--bp-text-muted);
    letter-spacing: 0.2px;
}

.trs-scan-footer-count {
    font-family: var(--bp-mono);
    font-weight: 700;
    color: var(--bp-text-secondary);
}

/* Mobile: скрыть полностью */
@media (max-width: 640px) {
    .trs-scan {
        display: none;
    }
}


@media (max-width: 640px) {
    .trs-section-title { font-size: 22px; }

    .trs-search-btn {
        padding: 0 16px;
        font-size: 13px;
    }

    .trs-risk-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .trs-risk-badge {
        align-self: flex-start;
    }

    .trs-source-row {
        padding: 12px 14px;
    }

    .trs-source-count {
        font-size: 17px;
    }
}


/* ══════════════════════════════════════════════════════════════
   SUGGEST DROPDOWN — autocomplete
   ══════════════════════════════════════════════════════════════ */

.trs-suggest-wrap {
    flex: 1;
    position: relative;
    min-width: 0;
}

.trs-suggest-drop {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--bp-card-raised);
    border: 1px solid var(--bp-border-hover);
    border-radius: var(--bp-radius-sm);
    overflow: hidden;
    z-index: var(--z-header-dropdown);
}

.trs-suggest-drop--open {
    display: block;
}

.trs-suggest-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: background var(--bp-transition-fast);
    border-bottom: 1px solid var(--bp-border-light);
}

.trs-suggest-item:last-child {
    border-bottom: none;
}

.trs-suggest-item:hover,
.trs-suggest-item--active {
    background: var(--bp-card-hover);
}

.trs-suggest-handle {
    font-size: 14px;
    font-weight: 600;
    color: var(--bp-text);
    font-family: var(--bp-mono);
}

.trs-suggest-sources {
    display: flex;
    gap: 5px;
    flex-shrink: 0;
}

.trs-suggest-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    letter-spacing: 0.3px;
}

.trs-suggest-badge--scam {
    background: var(--bp-red-dim);
    color: var(--bp-red);
}

.trs-suggest-badge--redflag {
    background: var(--bp-orange-dim);
    color: var(--bp-orange);
}

.trs-suggest-badge--disputes {
    background: var(--bp-accent-dim);
    color: var(--bp-accent);
}
