/* === Traffic Exchange Plugin Styles === */

.te-wrap { max-width: 900px; margin: 0 auto; font-family: inherit; }

/* Карточки метрик */
.te-cards { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 28px; }
.te-card {
    flex: 1 1 160px;
    background: #f8f9fa;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 18px 20px;
    text-align: center;
}
.te-card--primary { background: #1a56db; border-color: #1a56db; color: #fff; }
.te-card__label { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; opacity: .75; }
.te-card__value { display: block; font-size: 32px; font-weight: 700; margin: 6px 0 2px; }
.te-card__unit  { display: block; font-size: 12px; opacity: .7; }

/* Кнопки */
.te-btn {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.te-btn:hover { background: #f3f4f6; }
.te-btn--primary { background: #1a56db; border-color: #1a56db; color: #fff; }
.te-btn--primary:hover { background: #1649c0; color: #fff; }
.te-btn--lg { padding: 14px 32px; font-size: 16px; }
.te-btn--sm { padding: 6px 14px; font-size: 13px; }

/* Секции */
.te-section { margin-top: 28px; }
.te-section h3 { margin-bottom: 12px; font-size: 16px; font-weight: 700; }
.te-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }

/* Реф. ссылка */
.te-reflink { display: flex; gap: 8px; align-items: center; }
.te-reflink__input { flex: 1; padding: 8px 12px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; }

/* Таблица */
.te-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.te-table th, .te-table td { padding: 10px 12px; border-bottom: 1px solid #e5e7eb; text-align: left; }
.te-table th { background: #f9fafb; font-weight: 600; font-size: 12px; text-transform: uppercase; }
.te-plus { color: #16a34a; font-weight: 700; }
.te-minus { color: #dc2626; font-weight: 700; }

/* Уведомления */
.te-notice {
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 14px;
}
.te-notice--warn    { background: #fef9c3; border: 1px solid #fde047; color: #713f12; }
.te-notice--info    { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; }
.te-notice--success { background: #f0fdf4; border: 1px solid #bbf7d0; color: #15803d; }
.te-notice--error   { background: #fef2f2; border: 1px solid #fecaca; color: #dc2626; }

/* Подсказка */
.te-hint { font-size: 13px; color: #6b7280; margin-top: 6px; }

/* Формы */
.te-form .te-form__row { margin-bottom: 16px; }
.te-form label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.te-input {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
}
.te-input--sm { width: 90px; }
textarea.te-input { resize: vertical; }

/* ======= Серфинг ======= */
.te-surf-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}
.te-surf-balance { font-size: 16px; }
.te-surf-title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* Прогресс-бар таймера */
.te-timer-wrap { display: flex; align-items: center; gap: 10px; }
.te-timer-bar {
    flex: 1;
    height: 10px;
    background: #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
}
.te-timer-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #1a56db, #06b6d4);
    border-radius: 999px;
}
.te-timer-text { font-size: 14px; font-weight: 700; min-width: 28px; text-align: right; }

/* Iframe */
.te-surf-frame {
    width: 100%;
    height: 520px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    margin-top: 10px;
    background: #f9fafb;
}

/* Статус серфинга */
.te-surf-status {
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}
.te-surf-status--success { background: #f0fdf4; color: #15803d; }
.te-surf-status--error   { background: #fef2f2; color: #dc2626; }

/* ======= Сайты ======= */
.te-sites-list { display: flex; flex-direction: column; gap: 14px; margin-top: 16px; }
.te-site-card {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 16px;
}
.te-site-card--active   { border-left: 4px solid #16a34a; }
.te-site-card--pending  { border-left: 4px solid #f59e0b; }
.te-site-card--rejected { border-left: 4px solid #dc2626; opacity: .7; }
.te-site-card--paused   { border-left: 4px solid #6b7280; }

.te-site-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 8px;
}
.te-site-card__head a { font-weight: 600; text-decoration: none; }
.te-site-card__meta   { display: flex; gap: 20px; font-size: 13px; color: #6b7280; margin-bottom: 10px; }

.te-badge {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
}
.te-badge--active   { background: #dcfce7; color: #15803d; }
.te-badge--pending  { background: #fef9c3; color: #92400e; }
.te-badge--rejected { background: #fee2e2; color: #991b1b; }
.te-badge--paused   { background: #f3f4f6; color: #374151; }

.te-fund-form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Адаптив */
@media (max-width: 600px) {
    .te-cards { flex-direction: column; }
    .te-surf-frame { height: 320px; }
    .te-surf-header { flex-direction: column; align-items: flex-start; }
}
