/* Videre theme for Fider — paste into Settings → General → Custom CSS */

/* ── FONTS ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* ── BASE ── */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  background: #0d0d1a !important;
  color: #e0e0e0 !important;
}

/* ── HEADER / NAV ── */
.p-header {
  background: rgba(13,13,26,0.92) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
}
.p-header .brand {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
  letter-spacing: -0.3px !important;
}
.p-header a { color: #aaa !important; }
.p-header a:hover { color: #fff !important; }

/* ── PAGE BACKGROUND ── */
.p-home, .p-posts, .p-post, .p-admin, .p-user, .p-signin, .p-signup, .p-forgot, .p-complete-profile {
  background: #0d0d1a !important;
}

/* ── CONTENT PANELS ── */
.l-page, .c-segment, .c-card,
.bg-white, .box,
.p-home__welcome-col > div,
.p-home__posts-col,
.c-posts-container__header {
  background: #1a1a2e !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
  border-radius: 8px !important;
}
.bg-gray-100 { background: rgba(255,255,255,0.05) !important; }
.border-gray-200, .border-gray-400 { border-color: rgba(255,255,255,0.12) !important; }
.text-gray-800 { color: #e0e0e0 !important; }
.text-gray-500 { color: #888 !important; }

/* ── FILTER / SORT BUTTONS ── */
.c-dropdown__handle {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: #e0e0e0 !important;
  border-radius: 8px !important;
}

/* ── HEADINGS & TEXT ── */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', sans-serif !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: -0.3px !important;
}
p, span, li, label, .c-list { color: #aaa !important; }
a { color: #3498db !important; }
a:hover { color: #5bb3f0 !important; }

/* ── PRIMARY BUTTONS ── */
.c-button.primary,
.c-button--primary,
button[type="submit"].primary,
.ui.primary.button {
  background: linear-gradient(135deg, #e94560, #c0392b) !important;
  border: none !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  transition: filter 0.15s, transform 0.15s !important;
}
.c-button.primary:hover,
.c-button--primary:hover,
.ui.primary.button:hover {
  filter: brightness(1.1) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 20px rgba(233,69,96,0.4) !important;
}

/* ── SECONDARY / GHOST BUTTONS ── */
.c-button,
.ui.button {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  color: #e0e0e0 !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  transition: background 0.15s, border-color 0.15s !important;
}
.c-button:hover, .ui.button:hover {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.25) !important;
}

/* ── INPUTS & TEXTAREAS ── */
.c-input, input, textarea, select,
.ui.input input, .ui.form input, .ui.form textarea {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #e0e0e0 !important;
  border-radius: 6px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}
.c-input:focus, input:focus, textarea:focus {
  border-color: rgba(255,255,255,0.28) !important;
  outline: none !important;
  box-shadow: none !important;
}
input::placeholder, textarea::placeholder { color: #555 !important; }

/* ── TAGS / VOTE COUNTS ── */
.c-tag, .c-vote-count {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #aaa !important;
  border-radius: 6px !important;
}

/* ── VOTE BUTTON ── */
.c-vote-button.supported,
.c-vote-button.voted {
  background: rgba(233,69,96,0.15) !important;
  border-color: rgba(233,69,96,0.35) !important;
  color: #e94560 !important;
}

/* ── IDEA LIST ITEMS ── */
.c-idea-list-item,
.c-posts-container__post {
  background: #1a1a2e !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  transition: border-color 0.15s !important;
}
.c-idea-list-item:hover,
.c-posts-container__post:hover {
  border-color: rgba(255,255,255,0.12) !important;
}

/* ── VOTE COUNTER ── */
.c-vote-counter__button {
  background: #1a1a2e !important;
  border-color: rgba(255,255,255,0.12) !important;
  color: #e0e0e0 !important;
}

/* ── STATUS BADGES ── */
.c-status-label {
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* ── DIVIDERS / BORDERS ── */
.ui.divider, hr { border-color: rgba(255,255,255,0.06) !important; }

/* ── NOTIFICATIONS / TOASTS ── */
.c-notification {
  background: #1a1a2e !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #e0e0e0 !important;
  border-radius: 8px !important;
}

/* ── MODAL / OVERLAY ── */
.c-modal-dimmer { background: rgba(0,0,0,0.75) !important; }
.c-modal-window {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.c-share-feedback__content,
.c-share-feedback-signin {
  background: #1a1a2e !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  padding: 24px !important;
}
.c-editor-toolbar {
  background: rgba(255,255,255,0.04) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.fider-tiptap-editor,
.tiptap.ProseMirror {
  background: rgba(255,255,255,0.03) !important;
  color: #e0e0e0 !important;
}
.similar-posts-container {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 6px !important;
}
.text-gray-700 { color: #aaa !important; }
.text-link { color: #3498db !important; }

/* ── SCROLLBAR ── */
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.1) transparent; }
*::-webkit-scrollbar { width: 6px; }
*::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }