/* Racoon TV Search v2.0 */
:root { --rts-color:#e8c44a; --rts-bg:#1a1a2e; }

#rts-wrapper {
  font-family:'Segoe UI',Arial,sans-serif;
  max-width:680px;
  margin:0 auto;
  padding:10px 0 20px;
}

/* ── Onglets ── */
#rts-tabs {
  display:flex;
  gap:10px;
  margin-bottom:14px;
}

.rts-tab {
  flex:1;
  padding:11px 0;
  border:2px solid var(--tab-color, #e8c44a);
  border-radius:50px;
  background:transparent;
  color:rgba(255,255,255,.5);
  font-size:.95rem;
  font-weight:600;
  cursor:pointer;
  transition:all .2s;
}

.rts-tab:hover {
  background:rgba(255,255,255,.05);
  color:#fff;
}

.rts-tab.active {
  background:var(--tab-color, #e8c44a);
  color:#1a1a2e;
}

/* ── Barre de recherche ── */
#rts-search-box {
  display:flex;
  align-items:center;
  background:var(--rts-bg);
  border:2px solid var(--rts-color);
  border-radius:50px;
  padding:0 20px;
  gap:10px;
  transition:box-shadow .25s, border-color .3s;
}

#rts-search-box:focus-within {
  box-shadow:0 0 0 4px rgba(255,255,255,.1);
}

#rts-icon { font-size:1.2rem; opacity:.7; }

#rts-input {
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  color:#fff;
  font-size:1rem;
  padding:14px 0;
}

#rts-input::placeholder { color:rgba(255,255,255,.35); }

/* ── Spinner ── */
#rts-spinner {
  width:18px; height:18px;
  border:2px solid rgba(255,255,255,.15);
  border-top-color:var(--rts-color);
  border-radius:50%;
  animation:rts-spin .6s linear infinite;
  flex-shrink:0;
}
#rts-spinner.hidden { display:none; }
@keyframes rts-spin { to { transform:rotate(360deg); } }

/* ── Résultats ── */
#rts-results {
  margin-top:12px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
}
#rts-results.hidden { display:none; }

.rts-status {
  background:var(--rts-bg);
  color:rgba(255,255,255,.6);
  padding:18px 20px;
  text-align:center;
  font-size:.95rem;
}
.rts-status.not-found { color:rgba(255,255,255,.4); }

#rts-count {
  background:var(--rts-bg);
  color:rgba(255,255,255,.45);
  font-size:.8rem;
  padding:8px 20px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

/* ── Item ── */
.rts-item {
  display:flex;
  align-items:center;
  gap:14px;
  background:var(--rts-bg);
  padding:12px 18px;
  border-bottom:1px solid rgba(255,255,255,.05);
  transition:background .15s;
}
.rts-item:last-child { border-bottom:none; }
.rts-item:hover { background:rgba(255,255,255,.04); }

.rts-logo-wrap { flex-shrink:0; }

.rts-logo {
  width:42px; height:42px;
  object-fit:contain;
  border-radius:6px;
  background:rgba(255,255,255,.04);
  display:block;
}

.rts-logo-placeholder {
  width:42px; height:42px;
  border-radius:6px;
  background:rgba(255,255,255,.06);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
}

.rts-info { flex:1; min-width:0; }

.rts-name {
  color:#fff;
  font-size:.95rem;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rts-name mark {
  background:rgba(255,255,255,.2);
  color:var(--rts-color);
  border-radius:3px;
  padding:0 2px;
}

.rts-group {
  color:rgba(255,255,255,.38);
  font-size:.78rem;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.rts-badge {
  background:rgba(76,175,80,.15);
  color:#4caf50;
  font-size:.72rem;
  font-weight:700;
  padding:3px 10px;
  border-radius:20px;
  border:1px solid rgba(76,175,80,.3);
  white-space:nowrap;
  flex-shrink:0;
}

/* ── Footer ── */
#rts-footer {
  text-align:right;
  color:rgba(255,255,255,.2);
  font-size:.72rem;
  margin-top:8px;
  padding-right:4px;
}
