/* =============================================
   JobMatched Brand Theme for Fider
   feedback.jobmatched.ai
   ============================================= */

/* --- Light theme color overrides --- */
[data-theme="light"] {
  --colors-primary-base: #1976D2;
  --colors-primary-dark: #1565C0;
  --colors-primary-light: #BBDEFB;
  --colors-primary-lightest: #E3F2FD;
  --colors-gray-50: #FAFAFA;
  --colors-gray-100: #F5F5F5;
  --colors-gray-200: #E5E7EB;
  --colors-gray-300: #D1D5DB;
  --colors-gray-400: #9CA3AF;
  --colors-gray-500: #6B7280;
  --colors-gray-600: #4B5563;
  --colors-gray-700: #374151;
  --colors-gray-800: #1F2937;
  --colors-gray-900: #111111;
  --colors-white: #FFFFFF;
}

/* --- Dark theme color overrides --- */
[data-theme="dark"] {
  --colors-primary-base: #42A5F5;
  --colors-primary-dark: #1976D2;
  --colors-primary-light: #1E3A5F;
  --colors-primary-lightest: #0F2744;
  --colors-gray-50: #0F172A;
  --colors-gray-100: #1E293B;
  --colors-gray-200: #334155;
  --colors-gray-300: #475569;
  --colors-gray-400: #64748B;
  --colors-gray-500: #94A3B8;
  --colors-gray-600: #CBD5E1;
  --colors-gray-700: #E2E8F0;
  --colors-gray-800: #F1F5F9;
  --colors-gray-900: #F8FAFC;
  --colors-white: #0F172A;
}

/* --- Navigation bar --- */
.c-menu {
  border-bottom: 1px solid var(--colors-gray-200);
  box-shadow: none;
}

.c-menu h1.text-header {
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* --- Vote counter buttons --- */
.c-vote-counter__button {
  border-radius: 10px !important;
  border-color: var(--colors-gray-200) !important;
  background-color: var(--colors-white) !important;
  transition: all 0.15s ease;
}

.c-vote-counter__button:hover {
  border-color: var(--colors-primary-base) !important;
  background-color: var(--colors-primary-lightest) !important;
}

.c-vote-counter__button--voted {
  border-color: var(--colors-primary-base) !important;
  background-color: var(--colors-primary-lightest) !important;
  color: var(--colors-primary-base) !important;
}

/* --- Post cards --- */
.c-posts-container__post {
  padding: 16px 0;
  border-bottom: 1px solid var(--colors-gray-200);
  transition: background-color 0.15s ease;
}

.c-posts-container__post:last-child {
  border-bottom: none;
}

/* --- Post titles --- */
a.text-title {
  font-weight: 600;
  color: var(--colors-gray-900);
}

a.text-title:hover {
  color: var(--colors-primary-base) !important;
}

/* --- Tags --- */
.c-tag {
  border-radius: 9999px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  font-weight: 500;
  background-color: var(--colors-primary-lightest) !important;
  color: var(--colors-primary-base) !important;
  border: 1px solid var(--colors-primary-light) !important;
  transition: all 0.15s ease;
}

.c-tag:hover {
  background-color: var(--colors-primary-light) !important;
}

/* --- Primary buttons --- */
.c-button--primary {
  border-radius: 8px !important;
  font-weight: 600;
  transition: all 0.15s ease;
}

/* --- Secondary buttons --- */
.c-button--secondary {
  border-radius: 8px !important;
  border-color: var(--colors-gray-200) !important;
  transition: all 0.15s ease;
}

.c-button--secondary:hover {
  border-color: var(--colors-primary-base) !important;
  color: var(--colors-primary-base) !important;
}

/* --- Input fields --- */
.c-input,
.c-form-field textarea,
.c-form-field input {
  border-radius: 8px !important;
  border-color: var(--colors-gray-200) !important;
  transition: border-color 0.15s ease;
}

.c-input:focus,
.c-form-field textarea:focus,
.c-form-field input:focus {
  border-color: var(--colors-primary-base) !important;
  box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1) !important;
  outline: none !important;
}

/* --- Welcome column --- */
.p-home__welcome-col {
  border-right: 1px solid var(--colors-gray-200);
}

/* --- Filter and sort buttons --- */
.c-posts-container__header .c-button {
  border-radius: 8px !important;
}

/* --- Powered by Fider link --- */
.c-powered a {
  color: var(--colors-gray-400) !important;
  font-size: 12px;
}

/* --- Avatars --- */
.c-avatar {
  border-radius: 9999px;
}

/* --- Dropdown menus --- */
.c-dropdown__menu {
  border-radius: 10px !important;
  border: 1px solid var(--colors-gray-200) !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1) !important;
}

/* --- Post detail: vote button --- */
.c-button--primary.c-vote-button {
  border-radius: 10px !important;
}

/* --- Smooth link transitions --- */
a {
  transition: color 0.15s ease;
}

/* --- Dim Powered by Fider --- */
.c-powered {
  opacity: 0.4;
}